/* =========================================================
   SKULLSMP - TEBEX EXO THEME
   ========================================================= */

:root {
  --skull-bg: #02070d;
  --skull-panel: rgba(8, 25, 39, .98);
  --skull-panel-2: rgba(12, 37, 56, .98);

  --skull-border: rgba(75, 184, 246, .26);
  --skull-border-strong: rgba(79, 202, 255, .68);

  --skull-blue: #43baff;
  --skull-blue-light: #72d6ff;
  --skull-cyan: #43e1e8;

  --skull-text: #f4f9fd;
  --skull-muted: #9db6c8;

  --skull-green: #43df8a;
  --skull-red: #ef5160;

  --tebex-legal-footer-background-color: #030b12;
  --tebex-legal-footer-text-color: #9db6c8;
  --tebex-legal-footer-border-color: rgba(75, 184, 246, .20);
  --tebex-legal-footer-logo-color: #dcecf5;
}


/* =========================================================
   PAGE BACKGROUND
   ========================================================= */

html,
body {
  background:
    radial-gradient(
      circle at 50% -15%,
      rgba(48, 169, 232, .11),
      transparent 38%
    ),
    linear-gradient(
      180deg,
      #040b12 0%,
      #02070d 52%,
      #010407 100%
    ) !important;

  color: var(--skull-text);
}


body::before {
  content: "";

  position: fixed;
  inset: 0;

  z-index: -1;

  pointer-events: none;

  opacity: .09;

  background-image:
    radial-gradient(
      circle,
      rgba(86, 193, 255, .55) 0 1px,
      transparent 1.5px
    ),
    radial-gradient(
      circle,
      rgba(255, 255, 255, .20) 0 1px,
      transparent 1.5px
    );

  background-size:
    190px 190px,
    280px 280px;

  background-position:
    0 0,
    75px 85px;
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header {
  background:
    rgba(4, 14, 23, .96) !important;

  border-color:
    var(--skull-border) !important;
}


.site-navigation {
  background:
    rgba(4, 14, 23, .96) !important;

  border-color:
    var(--skull-border) !important;
}


.site-header a,
.site-navigation a {
  color:
    #dbe8f0;
}


.site-header a:hover,
.site-navigation a:hover {
  color:
    var(--skull-blue-light);
}


/* =========================================================
   HEADER IMAGES
   ========================================================= */

.site-header .info .image {
  display:
    block !important;

  width:
    48px !important;

  height:
    48px !important;

  min-width:
    48px !important;

  min-height:
    48px !important;

  max-width:
    48px !important;

  max-height:
    48px !important;

  object-fit:
    contain !important;

  flex:
    0 0 48px !important;
}


.site-header .site-title img {
  display:
    block !important;

  width:
    auto !important;

  height:
    auto !important;

  max-width:
    150px !important;

  max-height:
    110px !important;

  object-fit:
    contain !important;

  background:
    transparent !important;
}


/* =========================================================
   HEADER BUTTONS
   ========================================================= */

.site-header .open-basket {
  border-color:
    rgba(79, 202, 255, .40) !important;

  background:
    linear-gradient(
      145deg,
      #48c1ff,
      #198bd1
    ) !important;

  color:
    #ffffff !important;
}


.site-header .open-basket:hover {
  filter:
    brightness(1.08);
}


.site-header .log-in,
.site-header .user-name {
  border-color:
    var(--skull-border) !important;

  background:
    rgba(15, 43, 64, .82) !important;

  color:
    #e9f4fa !important;
}


/* =========================================================
   REMOVE LANGUAGE SWITCHER COMPLETELY
   ========================================================= */

.language-selector,
.language-switcher,
.language-picker,
.language-dropdown,

.locale-selector,
.locale-switcher,
.locale-picker,
.locale-dropdown,

[class*="language-selector"],
[class*="language-switcher"],
[class*="language-picker"],
[class*="language-dropdown"],

[class*="locale-selector"],
[class*="locale-switcher"],
[class*="locale-picker"],
[class*="locale-dropdown"] {
  display:
    none !important;

  visibility:
    hidden !important;
}


.site-header select[name="language"],
.site-header select[name="locale"],
.site-header select[name="language_code"],
.site-header select[name*="locale"],
.site-header select[name*="language"],
.site-header form[action*="language"],
.site-header form[action*="locale"] {
  display:
    none !important;

  visibility:
    hidden !important;
}


select[name="language"],
select[name="locale"],
select[name="language_code"] {
  display:
    none !important;

  visibility:
    hidden !important;
}


[data-language-selector],
[data-language-switcher],
[data-locale-selector],
[data-locale-switcher] {
  display:
    none !important;

  visibility:
    hidden !important;
}


.site-header a[href*="/language"],
.site-header a[href*="/locale"],
.site-header a[href*="?language="],
.site-header a[href*="?locale="] {
  display:
    none !important;
}


body > .language-selector,
body > .language-switcher,
body > .language-picker,
body > .language-dropdown,
body > .locale-selector,
body > .locale-switcher,
body > .locale-picker,
body > .locale-dropdown {
  display:
    none !important;

  visibility:
    hidden !important;
}


/* =========================================================
   REMOVE MOBILE HAMBURGER / DROPDOWN
   ========================================================= */

@media (max-width: 960px) {

  .site-header .toggle-navigation {
    display:
      none !important;
  }


  .site-header > .site-navigation {
    display:
      none !important;
  }


  body.show-navigation
  .site-header > .site-navigation {
    display:
      none !important;
  }

}


/* =========================================================
   HOMEPAGE
   ========================================================= */

.skullsmp-home,
.skullsmp-home * {
  box-sizing:
    border-box;
}


/* =========================================================
   HOMEPAGE HERO
   ========================================================= */

.skullsmp-hero {
  position:
    relative;

  width:
    min(1120px, calc(100% - 32px));

  margin:
    30px auto 44px;

  padding:
    28px 24px 22px;

  overflow:
    hidden;

  border:
    1px solid var(--skull-border);

  border-radius:
    20px;

  background:
    radial-gradient(
      circle at 50% -15%,
      rgba(64, 180, 255, .18),
      transparent 46%
    ),
    linear-gradient(
      180deg,
      rgba(4, 14, 25, .98),
      rgba(7, 21, 35, .98)
    );

  box-shadow:
    0 24px 65px
    rgba(0, 0, 0, .30);
}


.skullsmp-hero::before {
  content: "";

  position:
    absolute;

  inset:
    0;

  pointer-events:
    none;

  opacity:
    .25;

  background-image:
    radial-gradient(
      circle,
      rgba(92, 199, 255, .55) 0 1px,
      transparent 1.5px
    );

  background-size:
    125px 125px;
}


.skullsmp-hero-grid {
  position:
    relative;

  z-index:
    2;

  display:
    grid;

  grid-template-columns:
    1fr 205px 1fr;

  gap:
    22px;

  align-items:
    center;
}


/* =========================================================
   SERVER / DISCORD CARDS
   ========================================================= */

.skullsmp-info-card {
  appearance:
    none;

  display:
    flex;

  align-items:
    center;

  gap:
    13px;

  min-height:
    72px;

  padding:
    13px 15px;

  border:
    1px solid var(--skull-border);

  border-radius:
    14px;

  background:
    linear-gradient(
      135deg,
      rgba(15, 44, 65, .97),
      rgba(9, 28, 44, .97)
    );

  color:
    var(--skull-text) !important;

  text-align:
    left;

  text-decoration:
    none !important;

  cursor:
    pointer;

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}


.skullsmp-info-card:hover {
  transform:
    translateY(-3px);

  border-color:
    var(--skull-border-strong);

  box-shadow:
    0 15px 34px
    rgba(39, 158, 222, .12);
}


.skullsmp-info-copy {
  min-width:
    0;
}


.skullsmp-info-card strong,
.skullsmp-info-card small {
  display:
    block;
}


.skullsmp-info-card strong {
  color:
    #ffffff;
}


.skullsmp-info-card small {
  margin-top:
    3px;

  color:
    var(--skull-muted);
}


/* =========================================================
   HERO ICONS
   ========================================================= */

.skullsmp-round-icon {
  display:
    grid;

  place-items:
    center;

  width:
    44px;

  height:
    44px;

  flex:
    0 0 44px;

  border-radius:
    50%;

  background:
    linear-gradient(
      145deg,
      #4cc5ff,
      #239ce5
    );

  color:
    #ffffff;
}


.skullsmp-round-icon svg {
  width:
    22px;

  height:
    22px;
}


/* =========================================================
   SERVER STATUS
   ========================================================= */

.skullsmp-status-dot {
  display:
    inline-block;

  width:
    7px;

  height:
    7px;

  margin-right:
    5px;

  border-radius:
    50%;

  background:
    var(--skull-green);

  box-shadow:
    0 0 10px
    rgba(67, 223, 138, .62);
}


.skullsmp-status-dot.offline {
  background:
    var(--skull-red);

  box-shadow:
    0 0 10px
    rgba(239, 81, 96, .55);
}


/* =========================================================
   HOMEPAGE LOGO
   ========================================================= */

.skullsmp-brand {
  display:
    flex;

  min-height:
    145px;

  flex-direction:
    column;

  align-items:
    center;

  justify-content:
    center;

  text-align:
    center;
}


.skullsmp-logo {
  display:
    block;

  width:
    126px;

  height:
    126px;

  object-fit:
    contain;

  background:
    transparent !important;

  border:
    none !important;

  box-shadow:
    none !important;

  filter:
    drop-shadow(
      0 13px 23px
      rgba(0, 0, 0, .42)
    );
}


.skullsmp-brand strong {
  margin-top:
    5px;

  color:
    #ffffff;
}


.skullsmp-brand small {
  color:
    var(--skull-muted);
}


/* =========================================================
   STORE BAR
   ========================================================= */

.skullsmp-storebar {
  position:
    relative;

  z-index:
    2;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    16px;

  margin-top:
    20px;

  padding:
    14px 16px;

  border:
    1px solid var(--skull-border);

  border-radius:
    14px;

  background:
    linear-gradient(
      135deg,
      rgba(15, 44, 65, .97),
      rgba(9, 28, 44, .97)
    );
}


.skullsmp-storebar span,
.skullsmp-storebar strong,
.skullsmp-storebar small {
  display:
    block;
}


.skullsmp-storebar strong {
  color:
    #ffffff;
}


.skullsmp-storebar small,
.skullsmp-secure {
  color:
    var(--skull-muted);
}


.skullsmp-copy-note {
  position:
    absolute;

  left:
    24px;

  bottom:
    4px;

  opacity:
    0;

  color:
    #91ffd0;

  font-size:
    11px;

  pointer-events:
    none;
}


.skullsmp-copy-note.show {
  opacity:
    1;
}


/* =========================================================
   HOMEPAGE CATEGORIES
   ========================================================= */

.skullsmp-category-section {
  width:
    min(1040px, calc(100% - 32px));

  margin:
    0 auto 42px;
}


.skullsmp-section-title {
  margin-bottom:
    20px;

  text-align:
    center;
}


.skullsmp-section-title > span,
.skullsmp-page-title > span {
  color:
    var(--skull-blue-light);

  font-size:
    10px;

  font-weight:
    900;

  letter-spacing:
    .17em;
}


.skullsmp-section-title h2 {
  margin:
    4px 0 5px;

  color:
    #ffffff;
}


.skullsmp-section-title p {
  margin:
    0;

  color:
    var(--skull-muted);
}


.skullsmp-category-grid {
  display:
    grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap:
    22px;
}


.skullsmp-category-card {
  display:
    flex;

  min-height:
    320px;

  flex-direction:
    column;

  overflow:
    hidden;

  border:
    1px solid var(--skull-border);

  border-radius:
    18px;

  background:
    radial-gradient(
      circle at 50% 20%,
      rgba(55, 181, 247, .14),
      transparent 42%
    ),
    linear-gradient(
      160deg,
      rgba(10, 30, 47, .98),
      rgba(4, 15, 25, .99)
    );

  color:
    #ffffff !important;

  text-decoration:
    none !important;

  box-shadow:
    0 19px 48px
    rgba(0, 0, 0, .27);

  transition:
    transform .18s ease,
    border-color .18s ease;
}


.skullsmp-category-card:hover {
  transform:
    translateY(-5px);

  border-color:
    var(--skull-border-strong);
}


.skullsmp-category-art {
  display:
    flex;

  height:
    195px;

  align-items:
    center;

  justify-content:
    center;

  padding:
    12px 20px 0;
}


.skullsmp-category-art img {
  display:
    block;

  width:
    205px;

  max-width:
    82%;

  height:
    180px;

  object-fit:
    contain;

  background:
    transparent;

  filter:
    drop-shadow(
      0 17px 22px
      rgba(0, 0, 0, .52)
    );
}


.skullsmp-category-copy {
  display:
    flex;

  flex:
    1;

  flex-direction:
    column;

  align-items:
    center;

  padding:
    0 22px 21px;

  text-align:
    center;
}


.skullsmp-category-copy small {
  color:
    var(--skull-blue-light);

  font-size:
    9px;

  font-weight:
    900;

  letter-spacing:
    .14em;
}


.skullsmp-category-copy strong {
  margin-top:
    3px;

  color:
    #ffffff;

  font-size:
    22px;
}


.skullsmp-category-copy p {
  max-width:
    300px;

  margin:
    7px 0 0;

  color:
    var(--skull-muted);
}


.skullsmp-category-copy > span {
  margin-top:
    12px;

  padding:
    7px 12px;

  border:
    1px solid rgba(71, 190, 251, .28);

  border-radius:
    999px;

  background:
    rgba(46, 170, 234, .08);

  color:
    var(--skull-blue-light);

  font-size:
    9px;

  font-weight:
    900;
}


/* =========================================================
   HOME CONTENT
   ========================================================= */

.skullsmp-home-content {
  width:
    min(1040px, calc(100% - 32px));

  margin:
    0 auto 46px;
}


.skullsmp-home-content .store-text {
  position:
    relative;

  box-sizing:
    border-box;

  width:
    100%;

  padding:
    25px 27px !important;

  overflow:
    hidden;

  border:
    1px solid rgba(75, 184, 246, .28) !important;

  border-radius:
    16px !important;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(67, 186, 255, .10),
      transparent 42%
    ),
    linear-gradient(
      145deg,
      rgba(10, 31, 48, .98),
      rgba(4, 16, 26, .99)
    ) !important;

  color:
    #dceaf3 !important;

  box-shadow:
    0 16px 40px
    rgba(0, 0, 0, .28);
}


.skullsmp-home-content .store-text::before {
  content: "";

  position:
    absolute;

  top:
    0;

  left:
    24px;

  right:
    24px;

  height:
    2px;

  background:
    linear-gradient(
      90deg,
      transparent,
      #43baff,
      #43e1e8,
      transparent
    );
}


.skullsmp-home-content .store-text p {
  color:
    #c9d9e4 !important;

  line-height:
    1.65 !important;
}


.skullsmp-home-content .store-text strong,
.skullsmp-home-content .store-text b {
  color:
    #ffffff !important;
}


/* =========================================================
   CATEGORY PAGE TITLE
   ========================================================= */

.skullsmp-page-title {
  box-sizing:
    border-box;

  width:
    min(1080px, calc(100% - 32px));

  margin:
    30px auto 24px;

  padding:
    24px 22px;

  border:
    1px solid var(--skull-border);

  border-radius:
    17px;

  background:
    radial-gradient(
      circle at 50% -30%,
      rgba(63, 187, 250, .16),
      transparent 50%
    ),
    linear-gradient(
      150deg,
      rgba(10, 30, 46, .97),
      rgba(5, 17, 27, .98)
    );

  text-align:
    center;

  box-shadow:
    0 18px 46px
    rgba(0, 0, 0, .24);
}


.skullsmp-page-title h1 {
  margin:
    4px 0 6px;

  color:
    #ffffff;
}


.skullsmp-page-title p {
  margin:
    0;

  color:
    var(--skull-muted);
}


/* =========================================================
   CATEGORY DESCRIPTION
   ========================================================= */

.skullsmp-category-description {
  position:
    relative;

  box-sizing:
    border-box;

  width:
    100%;

  margin:
    0 0 24px !important;

  padding:
    22px 24px !important;

  overflow:
    hidden;

  border:
    1px solid rgba(75, 184, 246, .28) !important;

  border-radius:
    15px !important;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(67, 186, 255, .10),
      transparent 42%
    ),
    linear-gradient(
      145deg,
      rgba(10, 31, 48, .98),
      rgba(4, 16, 26, .99)
    ) !important;

  color:
    #c9d9e4 !important;

  box-shadow:
    0 16px 40px
    rgba(0, 0, 0, .24);
}


.skullsmp-category-description::before {
  content: "";

  position:
    absolute;

  top:
    0;

  left:
    22px;

  right:
    22px;

  height:
    2px;

  background:
    linear-gradient(
      90deg,
      transparent,
      #43baff,
      #43e1e8,
      transparent
    );
}


.skullsmp-category-description p {
  color:
    #c9d9e4 !important;
}


.skullsmp-category-description strong,
.skullsmp-category-description b {
  color:
    #ffffff !important;
}


/* =========================================================
   PACKAGE CARDS
   ========================================================= */

.skullsmp-package-card {
  position:
    relative !important;

  box-sizing:
    border-box !important;

  overflow:
    hidden !important;

  border:
    1px solid rgba(75, 184, 246, .30) !important;

  border-radius:
    17px !important;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(67, 186, 255, .15),
      transparent 45%
    ),
    linear-gradient(
      155deg,
      #0b2639 0%,
      #071b2a 55%,
      #04111c 100%
    ) !important;

  color:
    #f4f9fd !important;

  box-shadow:
    0 16px 38px
    rgba(0, 0, 0, .30) !important;

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}


.skullsmp-package-card::before {
  content: "";

  position:
    absolute;

  top:
    0;

  left:
    20px;

  right:
    20px;

  height:
    2px;

  z-index:
    3;

  pointer-events:
    none;

  background:
    linear-gradient(
      90deg,
      transparent,
      var(--skull-blue),
      var(--skull-cyan),
      transparent
    );
}


.skullsmp-package-card:hover {
  transform:
    translateY(-4px);

  border-color:
    rgba(79, 202, 255, .68) !important;

  box-shadow:
    0 20px 46px
    rgba(0, 0, 0, .36),
    0 0 28px
    rgba(67, 186, 255, .08) !important;
}


.skullsmp-package-card
.skullsmp-package-card-image-link {
  display:
    flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  box-sizing:
    border-box !important;

  border:
    0 !important;

  background:
    radial-gradient(
      circle at 50% 45%,
      rgba(58, 181, 245, .16),
      rgba(6, 24, 38, .34) 55%,
      rgba(3, 14, 23, .45) 100%
    ) !important;

  color:
    inherit !important;
}


.skullsmp-package-card
.skullsmp-package-card-image {
  display:
    block !important;

  object-fit:
    contain !important;

  background:
    transparent !important;

  border:
    0 !important;

  box-shadow:
    none !important;

  filter:
    drop-shadow(
      0 15px 20px
      rgba(0, 0, 0, .42)
    );
}


.skullsmp-package-card
.skullsmp-package-card-image-default {
  background:
    linear-gradient(
      145deg,
      #0c2b41,
      #051722
    ) !important;
}


.skullsmp-package-card
.skullsmp-package-card-title {
  color:
    #ffffff !important;
}


.skullsmp-package-card
.skullsmp-package-card-title a {
  color:
    #ffffff !important;

  text-decoration:
    none !important;
}


.skullsmp-package-card
.skullsmp-package-card-title a:hover {
  color:
    var(--skull-blue-light) !important;
}


.skullsmp-package-card
.countdown {
  border-color:
    rgba(75, 184, 246, .30) !important;

  background:
    rgba(67, 186, 255, .12) !important;

  color:
    var(--skull-blue-light) !important;
}


/* =========================================================
   PACKAGE ACTIONS
   ========================================================= */

.skullsmp-product-actions {
  box-sizing:
    border-box !important;

  border-color:
    rgba(75, 184, 246, .18) !important;

  background:
    linear-gradient(
      145deg,
      rgba(12, 43, 64, .92),
      rgba(5, 23, 36, .96)
    ) !important;

  color:
    #ffffff !important;
}


.skullsmp-product-actions
.skullsmp-product-price {
  color:
    #ffffff !important;
}


.skullsmp-product-actions
.skullsmp-product-price strong {
  color:
    #ffffff !important;
}


.skullsmp-product-actions
.skullsmp-product-discount {
  color:
    #7e9aad !important;
}


.skullsmp-product-actions
.btn-primary,
.skullsmp-product-actions
.skullsmp-package-btn.btn-primary {
  border:
    1px solid rgba(79, 202, 255, .58) !important;

  background:
    linear-gradient(
      145deg,
      #43c5db,
      #2299bd
    ) !important;

  color:
    #031017 !important;

  box-shadow:
    0 7px 18px
    rgba(36, 181, 218, .14) !important;
}


.skullsmp-product-actions
.btn-primary:hover,
.skullsmp-product-actions
.skullsmp-package-btn.btn-primary:hover {
  filter:
    brightness(1.10);
}


.skullsmp-product-actions
.btn-secondary {
  border-color:
    rgba(75, 184, 246, .28) !important;

  background:
    linear-gradient(
      145deg,
      #123b55,
      #0a293e
    ) !important;

  color:
    #e9f7ff !important;
}


.skullsmp-product-actions
.btn-tertiary {
  border-color:
    rgba(75, 184, 246, .22) !important;

  background:
    #0b2b40 !important;

  color:
    #e8f6fd !important;
}


.skullsmp-product-actions
.skullsmp-package-added {
  border-color:
    rgba(75, 184, 246, .28) !important;

  background:
    linear-gradient(
      145deg,
      #123b55,
      #0a293e
    ) !important;

  color:
    #ffffff !important;
}


.skullsmp-product-actions
.skullsmp-package-quantity {
  border-color:
    rgba(75, 184, 246, .25) !important;

  background:
    #071d2c !important;
}


.skullsmp-product-actions
.skullsmp-package-quantity
.open-basket {
  background:
    #0a2b41 !important;

  color:
    #dff4ff !important;
}


.skullsmp-product-actions
.skullsmp-package-quantity
.quantity {
  border-color:
    rgba(75, 184, 246, .25) !important;

  background:
    #051722 !important;

  color:
    #ffffff !important;
}


.skullsmp-product-actions
.skullsmp-package-gift {
  border-color:
    rgba(75, 184, 246, .26) !important;

  background:
    #0d3048 !important;

  color:
    #dff4ff !important;
}


/* =========================================================
   DIRECT PACKAGE PAGE
   ========================================================= */

.skullsmp-package-page {
  background:
    transparent !important;
}


.skullsmp-package-full {
  position:
    relative !important;

  box-sizing:
    border-box !important;

  overflow:
    hidden !important;

  border:
    1px solid rgba(75, 184, 246, .34) !important;

  border-radius:
    18px !important;

  background:
    radial-gradient(
      circle at 50% -10%,
      rgba(67, 186, 255, .16),
      transparent 43%
    ),
    linear-gradient(
      155deg,
      #0b2639 0%,
      #071b2a 55%,
      #04111c 100%
    ) !important;

  color:
    #f4f9fd !important;

  box-shadow:
    0 22px 55px
    rgba(0, 0, 0, .38) !important;
}


.skullsmp-package-full::before {
  content: "";

  position:
    absolute;

  top:
    0;

  left:
    28px;

  right:
    28px;

  height:
    2px;

  pointer-events:
    none;

  z-index:
    5;

  background:
    linear-gradient(
      90deg,
      transparent,
      #43baff,
      #43e1e8,
      transparent
    );
}


.skullsmp-package-full
.skullsmp-package-title {
  color:
    #ffffff !important;

  font-weight:
    900 !important;
}


/* =========================================================
   PACKAGE IMAGE
   ========================================================= */

.skullsmp-package-preview-image-wrap {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  box-sizing:
    border-box;

  padding:
    18px;

  overflow:
    hidden;

  border:
    1px solid rgba(75, 184, 246, .25);

  border-radius:
    14px;

  background:
    radial-gradient(
      circle at 50% 45%,
      rgba(58, 181, 245, .17),
      rgba(6, 24, 38, .50) 62%,
      rgba(3, 14, 23, .60) 100%
    ) !important;
}


.skullsmp-package-full
.skullsmp-package-image {
  display:
    block !important;

  max-width:
    100% !important;

  object-fit:
    contain !important;

  background:
    transparent !important;

  border:
    0 !important;

  box-shadow:
    none !important;

  filter:
    drop-shadow(
      0 18px 26px
      rgba(0, 0, 0, .40)
    );
}


.skullsmp-package-full
.skullsmp-package-media {
  overflow:
    hidden;

  border:
    1px solid rgba(75, 184, 246, .22);

  border-radius:
    14px;

  background:
    linear-gradient(
      145deg,
      #0a293e,
      #051722
    ) !important;
}


.skullsmp-package-full
.skullsmp-package-media img {
  object-fit:
    contain !important;

  background:
    transparent !important;
}


.skullsmp-package-full
.skullsmp-package-image-default {
  border:
    1px solid rgba(75, 184, 246, .18) !important;

  border-radius:
    14px !important;

  background:
    linear-gradient(
      145deg,
      #0c2b41,
      #051722
    ) !important;
}


/* =========================================================
   PACKAGE ACTION AREA
   ========================================================= */

.skullsmp-package-actions-wrap {
  box-sizing:
    border-box;

  margin-top:
    16px;

  padding:
    0;

  border:
    1px solid rgba(75, 184, 246, .20);

  border-radius:
    14px;

  overflow:
    hidden;

  background:
    linear-gradient(
      145deg,
      #0b2b40,
      #061b2a
    ) !important;
}


.skullsmp-package-actions-wrap
.skullsmp-product-actions {
  margin:
    0 !important;

  border:
    0 !important;

  background:
    linear-gradient(
      145deg,
      #0d344d,
      #071f30
    ) !important;
}


/* =========================================================
   PACKAGE DESCRIPTION
   ========================================================= */

.skullsmp-package-full
.skullsmp-package-description {
  position:
    relative;

  box-sizing:
    border-box;

  margin-top:
    18px !important;

  padding:
    21px 22px !important;

  border:
    1px solid rgba(75, 184, 246, .22) !important;

  border-radius:
    13px !important;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(67, 186, 255, .08),
      transparent 45%
    ),
    linear-gradient(
      145deg,
      #0a293e,
      #051722
    ) !important;

  color:
    #c9d9e4 !important;
}


.skullsmp-package-full
.skullsmp-package-description h1,
.skullsmp-package-full
.skullsmp-package-description h2,
.skullsmp-package-full
.skullsmp-package-description h3,
.skullsmp-package-full
.skullsmp-package-description h4 {
  color:
    #ffffff !important;
}


.skullsmp-package-full
.skullsmp-package-description p,
.skullsmp-package-full
.skullsmp-package-description li {
  color:
    #c9d9e4 !important;

  line-height:
    1.65;
}


.skullsmp-package-full
.skullsmp-package-description strong,
.skullsmp-package-full
.skullsmp-package-description b {
  color:
    #ffffff !important;
}


.skullsmp-package-full
.skullsmp-package-description a {
  color:
    var(--skull-blue-light) !important;
}


/* =========================================================
   REAL EXO PACKAGE POPUP
   ========================================================= */

.store-product-popup
.store-product-popup-content {
  position:
    relative !important;

  box-sizing:
    border-box !important;

  overflow:
    hidden !important;

  border:
    1px solid rgba(75, 184, 246, .34) !important;

  border-radius:
    18px !important;

  background-color:
    #071d2c !important;

  background-image:
    radial-gradient(
      circle at 50% -5%,
      rgba(67, 186, 255, .16),
      transparent 38%
    ),
    linear-gradient(
      155deg,
      #0b2c42 0%,
      #071f30 55%,
      #041722 100%
    ) !important;

  color:
    #f4f9fd !important;

  box-shadow:
    0 28px 70px
    rgba(0, 0, 0, .48) !important;
}


.store-product-popup:not(.popup-loading)
.store-product-popup-content::after {
  content: "";

  position:
    absolute;

  top:
    0;

  left:
    28px;

  right:
    28px;

  height:
    2px;

  z-index:
    20;

  pointer-events:
    none;

  background:
    linear-gradient(
      90deg,
      transparent,
      #43baff,
      #43e1e8,
      transparent
    );
}


/* =========================================================
   POPUP TITLE
   ========================================================= */

.store-product-popup
.store-product-popup-content
> .product-title {
  color:
    #ffffff !important;

  background:
    transparent !important;
}


/* =========================================================
   POPUP IMAGE
   ========================================================= */

.store-product-popup
.store-product-popup-content
> .skullsmp-package-preview-image-wrap {
  border:
    1px solid rgba(75, 184, 246, .27) !important;

  border-radius:
    14px !important;

  background-color:
    #08263a !important;

  background-image:
    radial-gradient(
      circle at 50% 45%,
      rgba(67, 186, 255, .20),
      transparent 58%
    ),
    linear-gradient(
      145deg,
      #0b3048,
      #061c2b
    ) !important;
}


.store-product-popup
.store-product-popup-content
.skullsmp-package-image {
  background:
    transparent !important;

  border:
    none !important;

  box-shadow:
    none !important;
}


.store-product-popup
.store-product-popup-content
> img.image {
  border:
    1px solid rgba(75, 184, 246, .27) !important;

  border-radius:
    14px !important;

  background-color:
    #08263a !important;
}


/* =========================================================
   POPUP ACTION AREA
   ========================================================= */

.store-product-popup
.store-product-popup-content
> .skullsmp-package-actions-wrap {
  border:
    1px solid rgba(75, 184, 246, .26) !important;

  border-radius:
    14px !important;

  background:
    linear-gradient(
      145deg,
      #0d3853,
      #08283d
    ) !important;
}


.store-product-popup
.store-product-popup-content
.skullsmp-product-actions {
  background:
    linear-gradient(
      145deg,
      #0d3853,
      #08283d
    ) !important;
}


/* =========================================================
   POPUP DESCRIPTION
   ========================================================= */

.store-product-popup
.store-product-popup-content
> .skullsmp-package-description,

.store-product-popup
.store-product-popup-content
> .descr.text-content,

.store-product-popup
.store-product-popup-content
> .descr {
  box-sizing:
    border-box !important;

  margin-top:
    18px !important;

  padding:
    22px 24px !important;

  border:
    1px solid rgba(75, 184, 246, .24) !important;

  border-radius:
    14px !important;

  background-color:
    #082338 !important;

  background-image:
    radial-gradient(
      circle at 100% 0%,
      rgba(67, 186, 255, .10),
      transparent 42%
    ),
    linear-gradient(
      145deg,
      #0b3048,
      #061c2b
    ) !important;

  color:
    #c9d9e4 !important;

  box-shadow:
    inset 0 1px 0
    rgba(255, 255, 255, .025) !important;
}


.store-product-popup
.store-product-popup-content
.descr p {
  background:
    transparent !important;

  color:
    #c9d9e4 !important;
}


.store-product-popup
.store-product-popup-content
.descr ul,

.store-product-popup
.store-product-popup-content
.descr ol,

.store-product-popup
.store-product-popup-content
.descr li {
  background:
    transparent !important;

  color:
    #c9d9e4 !important;
}


.store-product-popup
.store-product-popup-content
.descr strong,

.store-product-popup
.store-product-popup-content
.descr b {
  background:
    transparent !important;

  color:
    #ffffff !important;
}


.store-product-popup
.store-product-popup-content
.descr h1,

.store-product-popup
.store-product-popup-content
.descr h2,

.store-product-popup
.store-product-popup-content
.descr h3,

.store-product-popup
.store-product-popup-content
.descr h4 {
  background:
    transparent !important;

  color:
    #ffffff !important;
}


.store-product-popup
.store-product-popup-content
.descr a {
  color:
    #72d6ff !important;
}


/* =========================================================
   POPUP CLOSE BUTTON
   ========================================================= */

.store-product-popup
.store-product-popup-content
.popup-close {
  border-color:
    rgba(75, 184, 246, .22) !important;

  background:
    rgba(10, 42, 63, .92) !important;

  color:
    #dff5ff !important;
}


/* =========================================================
   PACKAGE POPUP LOADER
   ========================================================= */

.store-product-popup.popup-loading
.store-product-popup-content {
  position:
    relative !important;

  min-height:
    210px;

  border:
    1px solid rgba(75, 184, 246, .30) !important;

  border-radius:
    18px !important;

  background-color:
    #071d2c !important;

  background-image:
    radial-gradient(
      circle at 50% 20%,
      rgba(67, 186, 255, .13),
      transparent 48%
    ),
    linear-gradient(
      145deg,
      #0b2c42,
      #061b29
    ) !important;
}


.store-product-popup.popup-loading
.store-product-popup-content::before {
  content:
    "";

  position:
    absolute;

  top:
    50%;

  left:
    50%;

  width:
    180px;

  height:
    4px;

  transform:
    translate(-50%, -50%);

  overflow:
    hidden;

  border-radius:
    999px;

  background:
    rgba(67, 186, 255, .12) !important;

  box-shadow:
    0 0 0 1px
    rgba(75, 184, 246, .18);
}


.store-product-popup.popup-loading
.store-product-popup-content::after {
  content:
    "";

  position:
    absolute;

  top:
    calc(50% - 2px);

  left:
    calc(50% - 90px);

  width:
    65px;

  height:
    4px;

  border-radius:
    999px;

  background:
    linear-gradient(
      90deg,
      #168bd2,
      #43baff,
      #43e1e8
    ) !important;

  box-shadow:
    0 0 14px
    rgba(67, 186, 255, .48);

  animation:
    skullsmp-popup-loading
    1s ease-in-out infinite;
}


@keyframes skullsmp-popup-loading {

  0% {
    transform:
      translateX(0);
  }

  50% {
    transform:
      translateX(115px);
  }

  100% {
    transform:
      translateX(0);
  }

}


/* =========================================================
   ABOUT US / CMS
   ========================================================= */

.skullsmp-cms-original {
  position:
    relative;

  box-sizing:
    border-box;

  width:
    100%;

  padding:
    30px 34px !important;

  overflow:
    hidden;

  border:
    1px solid rgba(75, 184, 246, .28) !important;

  border-radius:
    18px !important;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(67, 186, 255, .11),
      transparent 42%
    ),
    radial-gradient(
      circle at 0% 100%,
      rgba(67, 225, 232, .05),
      transparent 40%
    ),
    linear-gradient(
      145deg,
      #0a293e,
      #051722
    ) !important;

  color:
    #c9d9e4 !important;

  box-shadow:
    0 18px 46px
    rgba(0, 0, 0, .28);
}


.skullsmp-cms-original::before {
  content:
    "";

  position:
    absolute;

  top:
    0;

  left:
    28px;

  right:
    28px;

  height:
    2px;

  background:
    linear-gradient(
      90deg,
      transparent,
      #43baff,
      #43e1e8,
      transparent
    );
}


.skullsmp-cms-original h1,
.skullsmp-cms-original h2,
.skullsmp-cms-original h3,
.skullsmp-cms-original h4 {
  color:
    #ffffff !important;
}


.skullsmp-cms-original p,
.skullsmp-cms-original li {
  color:
    #c9d9e4 !important;

  line-height:
    1.65;
}


.skullsmp-cms-original strong,
.skullsmp-cms-original b {
  color:
    #ffffff !important;
}


.skullsmp-cms-original a {
  color:
    var(--skull-blue-light) !important;
}


/* =========================================================
   COMMUNITY GOAL
   ========================================================= */

.skullsmp-community-goal {
  box-sizing:
    border-box !important;

  width:
    100% !important;

  overflow:
    hidden !important;

  border:
    1px solid rgba(75, 184, 246, .35) !important;

  border-radius:
    18px !important;

  background:
    radial-gradient(
      circle at 50% -20%,
      rgba(67, 186, 255, .14),
      transparent 48%
    ),
    linear-gradient(
      155deg,
      #092438,
      #04131f
    ) !important;

  color:
    var(--skull-text) !important;

  box-shadow:
    0 16px 42px
    rgba(0, 0, 0, .24) !important;
}


.skullsmp-community-goal
.skullsmp-goal-header {
  box-sizing:
    border-box;

  display:
    flex;

  width:
    100%;

  align-items:
    center;

  gap:
    11px;

  padding:
    16px 18px;

  border-bottom:
    1px solid rgba(75, 184, 246, .16);

  background:
    rgba(43, 151, 212, .07);
}


.skullsmp-community-goal
.skullsmp-goal-icon {
  display:
    grid;

  place-items:
    center;

  width:
    39px;

  height:
    39px;

  flex:
    0 0 39px;

  border-radius:
    11px;

  color:
    #ffffff;

  background:
    linear-gradient(
      145deg,
      #4cc5ff,
      #238fd4
    );
}


.skullsmp-community-goal
.skullsmp-goal-icon svg {
  width:
    21px !important;

  height:
    21px !important;
}


.skullsmp-community-goal
.skullsmp-goal-label {
  display:
    block;

  margin-bottom:
    2px;

  color:
    var(--skull-blue-light);

  font-size:
    8px;

  font-weight:
    900;

  letter-spacing:
    .16em;
}


.skullsmp-community-goal
.widget-title {
  margin:
    0 !important;

  color:
    #ffffff !important;

  font-size:
    16px !important;

  font-weight:
    900 !important;
}


.skullsmp-community-goal
.widget-content {
  box-sizing:
    border-box !important;

  width:
    100% !important;

  padding:
    16px !important;

  background:
    transparent !important;
}


/* =========================================================
   COMMUNITY GOAL IMAGE
   ========================================================= */

.skullsmp-community-goal
.skullsmp-goal-image-wrap {
  position:
    relative;

  width:
    100%;

  aspect-ratio:
    16 / 9;

  margin:
    0 0 16px;

  overflow:
    hidden;

  border:
    1px solid rgba(75, 184, 246, .22);

  border-radius:
    12px;

  background:
    #03101a;
}


.skullsmp-community-goal
.skullsmp-goal-image-wrap
.skullsmp-goal-image,

.skullsmp-community-goal
.skullsmp-goal-image-wrap
.goal-image {
  position:
    absolute !important;

  inset:
    0 !important;

  width:
    100% !important;

  height:
    100% !important;

  max-width:
    none !important;

  max-height:
    none !important;

  object-fit:
    cover !important;

  object-position:
    center !important;

  border:
    0 !important;
}


.skullsmp-community-goal
.skullsmp-goal-description {
  color:
    var(--skull-muted) !important;
}


.skullsmp-community-goal
.skullsmp-goal-stats {
  display:
    flex;

  justify-content:
    space-between;

  margin-bottom:
    8px;

  color:
    var(--skull-muted);

  font-size:
    12px;
}


.skullsmp-community-goal
.skullsmp-goal-stats strong {
  color:
    var(--skull-blue-light);
}


.skullsmp-community-goal
.skullsmp-goal-progress {
  width:
    100% !important;

  height:
    12px !important;

  margin:
    0 !important;

  overflow:
    hidden;

  border:
    1px solid rgba(75, 184, 246, .25);

  border-radius:
    999px !important;

  background:
    #061824 !important;
}


.skullsmp-community-goal
.skullsmp-goal-progress-bar {
  height:
    100% !important;

  background:
    linear-gradient(
      90deg,
      #168bd2,
      #41bdff,
      #4ee8e8
    ) !important;
}


.skullsmp-community-goal
.skullsmp-goal-amount {
  display:
    flex;

  justify-content:
    center;

  gap:
    5px;

  margin-top:
    14px;
}


.skullsmp-community-goal
.skullsmp-goal-amount strong {
  color:
    #ffffff;
}


.skullsmp-community-goal
.skullsmp-goal-amount span {
  color:
    var(--skull-muted);
}


/* =========================================================
   EMPTY CATEGORY
   ========================================================= */

.skullsmp-empty-state {
  box-sizing:
    border-box;

  padding:
    25px;

  border:
    1px solid var(--skull-border);

  border-radius:
    14px;

  background:
    linear-gradient(
      145deg,
      #0a293e,
      #051722
    );

  color:
    var(--skull-text);

  text-align:
    center;
}


/* =========================================================
   LOGIN POPUP
   ========================================================= */

.login-popup
.popup-scroll-cont {
  background:
    rgba(1, 7, 12, .82) !important;

  backdrop-filter:
    blur(4px);
}


.login-popup
.login-popup-content {
  position:
    relative !important;

  box-sizing:
    border-box !important;

  overflow:
    hidden !important;

  border:
    1px solid rgba(75, 184, 246, .38) !important;

  border-radius:
    18px !important;

  background:
    radial-gradient(
      circle at 50% -20%,
      rgba(67, 186, 255, .18),
      transparent 48%
    ),
    linear-gradient(
      145deg,
      #0b2c42,
      #061b29
    ) !important;

  color:
    #f4f9fd !important;

  box-shadow:
    0 28px 75px
    rgba(0, 0, 0, .58),
    0 0 35px
    rgba(67, 186, 255, .06) !important;
}


.login-popup
.login-popup-content::before {
  content:
    "";

  position:
    absolute;

  top:
    0;

  left:
    28px;

  right:
    28px;

  height:
    2px;

  pointer-events:
    none;

  background:
    linear-gradient(
      90deg,
      transparent,
      #43baff,
      #43e1e8,
      transparent
    );
}


.login-popup
.login-popup-content h1,
.login-popup
.login-popup-content h2,
.login-popup
.login-popup-content h3 {
  color:
    #ffffff !important;

  font-weight:
    900 !important;
}


.login-popup
.login-popup-content p,
.login-popup
.login-popup-content label {
  color:
    #b7ccda !important;
}


.login-popup
.login-popup-content input {
  box-sizing:
    border-box !important;

  border:
    1px solid rgba(75, 184, 246, .28) !important;

  border-radius:
    9px !important;

  background:
    #061a28 !important;

  color:
    #ffffff !important;

  outline:
    none !important;

  transition:
    border-color .18s ease,
    box-shadow .18s ease;
}


.login-popup
.login-popup-content input::placeholder {
  color:
    #8da7b9 !important;
}


.login-popup
.login-popup-content input:focus {
  border-color:
    #43baff !important;

  box-shadow:
    0 0 0 3px
    rgba(67, 186, 255, .10) !important;
}


.login-popup
.login-popup-content
button[type="submit"],
.login-popup
.login-popup-content
.btn-primary {
  border:
    1px solid rgba(79, 202, 255, .55) !important;

  border-radius:
    8px !important;

  background:
    linear-gradient(
      145deg,
      #43c5db,
      #2299bd
    ) !important;

  color:
    #031017 !important;

  font-weight:
    900 !important;

  box-shadow:
    0 8px 20px
    rgba(36, 181, 218, .17) !important;
}


.login-popup
.login-popup-content
button[type="submit"]:hover,
.login-popup
.login-popup-content
.btn-primary:hover {
  filter:
    brightness(1.10);
}


.login-popup
.popup-close {
  border:
    1px solid rgba(75, 184, 246, .20) !important;

  border-radius:
    8px !important;

  background:
    rgba(7, 28, 43, .92) !important;

  color:
    #9fc7da !important;
}


.login-popup
.popup-close:hover {
  border-color:
    rgba(79, 202, 255, .52) !important;

  color:
    #ffffff !important;
}


/* =========================================================
   BASKET POPUP
   ========================================================= */

.basket-popup
.popup-scroll-cont {
  background:
    rgba(1, 7, 12, .80) !important;

  backdrop-filter:
    blur(3px);
}


.basket-popup
.basket-popup-content {
  position:
    relative !important;

  box-sizing:
    border-box !important;

  border-left:
    1px solid rgba(75, 184, 246, .38) !important;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(67, 186, 255, .15),
      transparent 38%
    ),
    linear-gradient(
      155deg,
      #0a293e 0%,
      #061b29 55%,
      #03111b 100%
    ) !important;

  color:
    #f4f9fd !important;

  box-shadow:
    -25px 0 70px
    rgba(0, 0, 0, .48) !important;
}


.basket-popup
.basket-popup-content::before {
  content:
    "";

  position:
    absolute;

  top:
    0;

  left:
    26px;

  right:
    26px;

  height:
    2px;

  pointer-events:
    none;

  background:
    linear-gradient(
      90deg,
      transparent,
      #43baff,
      #43e1e8,
      transparent
    );
}


/* =========================================================
   BASKET CLOSE BUTTON
   ========================================================= */

.basket-popup
.popup-close {
  border:
    1px solid rgba(75, 184, 246, .20) !important;

  border-radius:
    8px !important;

  background:
    rgba(7, 28, 43, .92) !important;

  color:
    #9fc7da !important;
}


.basket-popup
.popup-close:hover {
  border-color:
    rgba(79, 202, 255, .52) !important;

  color:
    #ffffff !important;
}


/* =========================================================
   EMPTY BASKET
   ========================================================= */

.basket-popup
.basket-empty {
  position:
    relative;

  box-sizing:
    border-box;

  width:
    calc(100% - 48px);

  max-width:
    420px;

  margin:
    auto;

  padding:
    32px 24px;

  border:
    1px solid rgba(75, 184, 246, .25);

  border-radius:
    16px;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(67, 186, 255, .10),
      transparent 52%
    ),
    linear-gradient(
      145deg,
      #0b3048,
      #061c2b
    );

  color:
    #ffffff !important;

  font-size:
    18px;

  font-weight:
    800;

  text-align:
    center;

  box-shadow:
    0 18px 42px
    rgba(0, 0, 0, .26);
}


.basket-popup
.basket-empty::before {
  content:
    "SKULLSMP";

  display:
    block;

  margin-bottom:
    9px;

  color:
    #72d6ff;

  font-size:
    9px;

  font-weight:
    900;

  letter-spacing:
    .18em;
}


/* =========================================================
   BASKET HEADERS
   ========================================================= */

.basket-popup
.basket-header,
.basket-popup
.basket-second-header {
  border-color:
    rgba(75, 184, 246, .18) !important;

  background:
    rgba(11, 43, 64, .58) !important;

  color:
    #ffffff !important;
}


.basket-popup
.basket-header h1,
.basket-popup
.basket-header h2,
.basket-popup
.basket-header h3,
.basket-popup
.basket-second-header h1,
.basket-popup
.basket-second-header h2,
.basket-popup
.basket-second-header h3 {
  color:
    #ffffff !important;
}


/* =========================================================
   BASKET CONTENT
   ========================================================= */

.basket-popup
.basket-content {
  color:
    #d4e5ef !important;
}


.basket-popup
.basket-item {
  border:
    1px solid rgba(75, 184, 246, .20) !important;

  border-radius:
    13px !important;

  background:
    linear-gradient(
      145deg,
      rgba(12, 45, 67, .94),
      rgba(6, 25, 39, .98)
    ) !important;

  color:
    #f4f9fd !important;
}


.basket-popup
.basket-item a {
  color:
    #ffffff !important;
}


.basket-popup
.basket-item a:hover {
  color:
    #72d6ff !important;
}


.basket-popup
.basket-item
a.remove {
  color:
    #ef7781 !important;
}


.basket-popup
.basket-item
a.remove:hover {
  color:
    #ff9ca4 !important;
}


/* =========================================================
   BASKET QUANTITY
   ========================================================= */

.basket-popup
.quantity-field {
  border-color:
    rgba(75, 184, 246, .24) !important;

  background:
    #061a28 !important;
}


.basket-popup
input.quantity {
  border-color:
    rgba(75, 184, 246, .24) !important;

  background:
    #04131e !important;

  color:
    #ffffff !important;
}


.basket-popup
button.decrease,
.basket-popup
button.increase {
  border-color:
    rgba(75, 184, 246, .22) !important;

  background:
    #0b2e45 !important;

  color:
    #ffffff !important;
}


.basket-popup
button.decrease:hover,
.basket-popup
button.increase:hover {
  background:
    #10405f !important;

  color:
    #72d6ff !important;
}


/* =========================================================
   BASKET TOTAL / CHECKOUT
   ========================================================= */

.basket-popup
.basket-checkout {
  border-color:
    rgba(75, 184, 246, .20) !important;

  background:
    rgba(7, 28, 43, .82) !important;
}


.basket-popup
.basket-checkout
.total {
  color:
    #ffffff !important;
}


.basket-popup
button.checkout {
  border:
    1px solid rgba(79, 202, 255, .55) !important;

  border-radius:
    9px !important;

  background:
    linear-gradient(
      145deg,
      #43c5db,
      #2299bd
    ) !important;

  color:
    #031017 !important;

  font-weight:
    900 !important;

  box-shadow:
    0 8px 22px
    rgba(36, 181, 218, .17) !important;
}


.basket-popup
button.checkout:hover {
  filter:
    brightness(1.10);
}


/* =========================================================
   BASKET REDEEM / COUPON
   ========================================================= */

.basket-popup
.basket-redeem {
  border-color:
    rgba(75, 184, 246, .18) !important;

  background:
    rgba(7, 28, 43, .55) !important;
}


.basket-popup
.basket-redeem input {
  border:
    1px solid rgba(75, 184, 246, .25) !important;

  border-radius:
    8px !important;

  background:
    #041722 !important;

  color:
    #ffffff !important;
}


.basket-popup
.basket-redeem input::placeholder {
  color:
    #829dad !important;
}


.basket-popup
.basket-redeem button,
.basket-popup
.basket-redeem .btn-secondary {
  border-color:
    rgba(75, 184, 246, .28) !important;

  background:
    #0c3048 !important;

  color:
    #e9f7ff !important;
}


/* =========================================================
   BASKET TEXT / PRICES
   ========================================================= */

.basket-popup
.basket-popup-content p,
.basket-popup
.basket-popup-content span,
.basket-popup
.basket-popup-content label {
  border-color:
    rgba(75, 184, 246, .18);
}


.basket-popup
.basket-popup-content strong {
  color:
    #ffffff;
}


/* =========================================================
   PLAYER HEAD
   SAFE ADD-ON
   ========================================================= */

.site-header
.user-name.skullsmp-has-player-head::before {
  content:
    none !important;

  display:
    none !important;
}


.site-header
.user-name
.skullsmp-player-head {
  display:
    inline-block !important;

  width:
    28px !important;

  height:
    28px !important;

  min-width:
    28px !important;

  min-height:
    28px !important;

  max-width:
    28px !important;

  max-height:
    28px !important;

  margin:
    0 8px 0 0 !important;

  padding:
    0 !important;

  object-fit:
    cover !important;

  image-rendering:
    pixelated;

  vertical-align:
    middle !important;

  border:
    1px solid
    rgba(75, 184, 246, .35) !important;

  border-radius:
    4px !important;

  background:
    #071722 !important;

  box-shadow:
    0 0 10px
    rgba(67, 186, 255, .10) !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 850px) {

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


  .skullsmp-brand {
    order:
      -1;
  }


  .skullsmp-category-grid {
    grid-template-columns:
      1fr;
  }


  .skullsmp-storebar {
    flex-direction:
      column;

    align-items:
      flex-start;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 520px) {

  .skullsmp-hero,
  .skullsmp-category-section,
  .skullsmp-home-content,
  .skullsmp-page-title {
    width:
      calc(100% - 18px);
  }


  .skullsmp-hero {
    padding:
      19px 13px 16px;
  }


  .skullsmp-home-content .store-text,
  .skullsmp-category-description,
  .skullsmp-cms-original {
    padding:
      19px 17px !important;
  }


  .skullsmp-community-goal
  .widget-content {
    padding:
      13px !important;
  }


  .skullsmp-package-full
  .skullsmp-package-description {
    padding:
      17px !important;
  }


  .skullsmp-package-preview-image-wrap {
    padding:
      10px;
  }


  .store-product-popup
  .store-product-popup-content
  > .skullsmp-package-description,

  .store-product-popup
  .store-product-popup-content
  > .descr {
    padding:
      18px !important;
  }


  .store-product-popup.popup-loading
  .store-product-popup-content::before {
    width:
      140px;
  }


  .store-product-popup.popup-loading
  .store-product-popup-content::after {
    left:
      calc(50% - 70px);

    width:
      50px;
  }


  .site-header
  .user-name
  .skullsmp-player-head {
    width:
      25px !important;

    height:
      25px !important;

    min-width:
      25px !important;

    min-height:
      25px !important;

    max-width:
      25px !important;

    max-height:
      25px !important;

    margin-right:
      6px !important;
  }


  .basket-popup
  .basket-empty {
    width:
      calc(100% - 28px);

    padding:
      25px 17px;
  }


  .login-popup
  .login-popup-content {
    max-width:
      calc(100% - 24px) !important;
  }


  @keyframes skullsmp-popup-loading {

    0% {
      transform:
        translateX(0);
    }

    50% {
      transform:
        translateX(90px);
    }

    100% {
      transform:
        translateX(0);
    }

  }

}