@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Rajdhani:wght@500;600;700;800&display=swap');

/* Piximplanet SpaceX Blue & Navy Galactic Theme Override - Super Specificity Version */

:root {
  --galactic-bg: #020205;
  --galactic-dark-navy: #05080c;
  --galactic-card-bg: rgba(8, 12, 18, 0.7);
  --galactic-border: rgba(255, 255, 255, 0.08);
  --galactic-accent: #00d2ff;
  --galactic-blue: #0066ff;
  --galactic-text: #ffffff;
  --galactic-text-muted: #8b9bb4;
  --galactic-neon-pink: #ff007f;
}

/* Global Background Override */
html,
body, 
body.dark-theme,
.rh-outer-wrap, 
#re-outer-wrap,
#content,
.main_content_area {
  background-color: var(--galactic-bg) !important;
  color: var(--galactic-text) !important;
}

/* Force Page and Content Box Containers to be Transparent (including ReHub's post wrapper) */
html body.woocommerce-account .main-side,
html body.woocommerce-account .content-box,
html body.woocommerce-account .post,
html body.woocommerce-account .post-inner,
html body.woocommerce-account .page-inner,
html body.woocommerce-account .rh-container,
html body.woocommerce-account .entry,
html body.woocommerce-account .rh-content-wrap,
html body.woocommerce-account #content-wrap,
html body.woocommerce-account .rehub-main-content,
html body.woocommerce-account .rh-post-wrapper {
  background-color: transparent !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Force My Account Page Title to be White */
html body.woocommerce-account h1.entry-title,
html body.woocommerce-account .title h1,
html body.woocommerce-account .entry-title,
html body.woocommerce-account .title h2,
html body.woocommerce-account .title h3 {
  color: var(--galactic-text) !important;
}

/* Style Native Avatar Circle - Large, Dark, no border */
html body.woocommerce-account .g2g-user-avatar {
  width: 120px !important;
  height: 120px !important;
  background-color: #0b0f19 !important;
  border: none !important;
  border-radius: 50% !important;
  margin: 0 auto 30px auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0px !important; /* Hide native R / P letter */
}

/* Draw Stylized SpaceX-like "P" inside the avatar */
html body.woocommerce-account .g2g-user-avatar::before {
  display: block !important;
  content: "P" !important;
  font-family: "Outfit", "Segoe UI", sans-serif !important;
  font-weight: 800 !important;
  font-size: 72px !important;
  color: #ffffff !important;
  line-height: 1 !important;
  transform: skewX(-12deg) !important;
}

/* Hide Avatar Image if present, to ensure the stylized P logo shows */
html body.woocommerce-account .g2g-user-avatar img {
  display: none !important;
}

/* Remove duplicate avatar & username elements from previous iteration */
html body.woocommerce-account .woocommerce-MyAccount-navigation::before,
html body.woocommerce-account .woocommerce-MyAccount-navigation::after {
  display: none !important;
  content: none !important;
}

/* Hide Native Hello Bubble & Username & Camera Overlay */
html body.woocommerce-account .g2g-hello-bubble,
html body.woocommerce-account .g2g-user-name,
html body.woocommerce-account .g2g-avatar-overlay {
  display: none !important;
}

/* Remove default border under avatar section */
html body.woocommerce-account .g2g-user-profile-header {
  border-bottom: none !important;
  margin-bottom: 20px !important;
  padding-bottom: 0 !important;
}

/* Hide Navigation Icons */
html body.woocommerce-account .g2g-woocommerce-myaccount .g2g-icon-circle {
  display: none !important;
}

/* Style Navigation Links (Clean Text links matching the user's reference image) */
html body.woocommerce-account .g2g-woocommerce-myaccount .woocommerce-MyAccount-navigation ul li a {
  border-radius: 0px !important;
  color: #8b9bb4 !important;
  font-weight: 500 !important;
  font-size: 18px !important;
  border-left: none !important;
  padding: 16px 36px !important; /* Aligned left with nice indent */
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  display: block !important;
}

html body.woocommerce-account .g2g-woocommerce-myaccount .woocommerce-MyAccount-navigation ul li.is-active a {
  background-color: var(--galactic-blue) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

html body.woocommerce-account .g2g-woocommerce-myaccount .woocommerce-MyAccount-navigation ul li a:hover {
  background-color: rgba(255, 255, 255, 0.03) !important;
  color: #ffffff !important;
}

/* Content Area Overrides */
html body.woocommerce-account .woocommerce-MyAccount-content {
  background-color: transparent !important;
  width: 100% !important;
  margin-left: 0 !important;
}

/* Welcome Banner - Sharp Corners, Space Navy Background */
html body.woocommerce-account .g2g-dashboard-welcome {
  background-color: var(--galactic-dark-navy) !important;
  background: var(--galactic-dark-navy) !important;
  border: 1px solid var(--galactic-border) !important;
  border-radius: 0px !important;
  border-top: 4px solid var(--galactic-accent) !important;
  color: var(--galactic-text-muted) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
  padding: 24px !important;
  text-align: left;
}

html body.woocommerce-account .g2g-dashboard-welcome h2 {
  color: var(--galactic-text) !important;
  font-weight: 700 !important;
  font-size: 24px !important;
  margin-bottom: 8px !important;
}

html body.woocommerce-account .g2g-dashboard-welcome p {
  color: var(--galactic-text-muted) !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

/* Stat Cards Container */
html body.woocommerce-account .g2g-dashboard-stats {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  gap: 20px !important;
  margin-bottom: 24px !important;
}

/* Stat Card - Force Space Navy background and keep rounded corners */
html body.woocommerce-account .g2g-stat-box {
  background-color: var(--galactic-card-bg) !important;
  background: var(--galactic-card-bg) !important;
  border: 1px solid var(--galactic-border) !important;
  border-radius: 4px !important;
  color: var(--galactic-text) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
  /* Removed fixed padding and height to allow the contents (value & sparklines) to display naturally */
}

html body.woocommerce-account .g2g-stat-box:hover {
  border-color: var(--galactic-accent) !important;
}

html body.woocommerce-account .g2g-stat-label {
  color: var(--galactic-text-muted) !important;
}

/* Fall back to our beautiful custom stat icon layout from my-account.css */

html body.woocommerce-account .g2g-stat-value {
  color: var(--galactic-text) !important;
}

html body.woocommerce-account .g2g-stat-footer {
  color: var(--galactic-accent) !important;
}

html body.woocommerce-account .g2g-stat-subtext {
  color: var(--galactic-accent) !important;
}

html body.woocommerce-account .g2g-stat-subtext.positive {
  color: var(--galactic-accent) !important;
}

/* Force Recent Orders Table and Cards to Dark theme & Sharp Corners */
html body.woocommerce-account .g2g-recent-orders-panel,
html body.woocommerce-account .g2g-empty-orders-state,
html body.woocommerce-account .woocommerce-orders-table, 
html body.woocommerce-account .my_account_orders {
  background-color: var(--galactic-card-bg) !important;
  background: var(--galactic-card-bg) !important;
  border: 1px solid var(--galactic-border) !important;
  border-radius: 0px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
  color: var(--galactic-text) !important;
  padding: 24px !important;
  box-sizing: border-box !important;
}

/* Recent Orders Title */
html body.woocommerce-account .g2g-recent-orders-panel h3 {
  color: var(--galactic-text) !important;
  font-weight: bold !important;
  text-transform: uppercase !important;
  font-size: 14px !important;
  letter-spacing: 1px !important;
}

/* Table Headers */
html body.woocommerce-account .woocommerce-MyAccount-content th {
  background-color: var(--galactic-dark-navy) !important;
  color: var(--galactic-text) !important;
  border-bottom: 1px solid var(--galactic-border) !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  letter-spacing: 1px !important;
}

/* Table cells */
html body.woocommerce-account .woocommerce-MyAccount-content td {
  background-color: var(--galactic-card-bg) !important;
  color: var(--galactic-text) !important;
  border-bottom: 1px solid var(--galactic-border) !important;
}

/* View Button / Visit Shop Button - Sharp Corners */
html body.woocommerce-account .woocommerce-orders-table__cell-order-actions a.button,
html body.woocommerce-account .g2g-empty-orders-state a.button {
  background-color: transparent !important;
  background: transparent !important;
  color: var(--galactic-text) !important;
  border: 1px solid var(--galactic-border) !important;
  border-radius: 0px !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}

html body.woocommerce-account .woocommerce-orders-table__cell-order-actions a.button:hover,
html body.woocommerce-account .g2g-empty-orders-state a.button:hover {
  background-color: var(--galactic-accent) !important;
  background: var(--galactic-accent) !important;
  color: var(--galactic-bg) !important;
  border-color: var(--galactic-accent) !important;
}

/* Status Pill Badges */
html body.woocommerce-account .woocommerce-orders-table__cell-order-status span,
html body.woocommerce-account mark.order-status {
  border-radius: 0px !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}

html body.woocommerce-account .woocommerce-orders-table__cell-order-status .status-processing,
html body.woocommerce-account mark.processing {
  background-color: rgba(0, 102, 255, 0.2) !important;
  color: var(--galactic-accent) !important;
  border: 1px solid rgba(0, 210, 255, 0.3) !important;
}


/* =========================================================
   GLOBAL OFF-CANVAS SIDEBAR NAVIGATION (DESKTOP & MOBILE)
   ========================================================= */

/* The Navigation container uses the exact geometric notch shape matching your screenshot! */
html body.woocommerce-account .g2g-woocommerce-myaccount .woocommerce-MyAccount-navigation {
  position: fixed !important;
  top: 0 !important;
  left: -280px !important; /* Hidden off-screen left globally */
  width: 260px !important;
  height: 100vh !important;
  background-color: var(--galactic-card-bg) !important;
  background: var(--galactic-card-bg) !important;
  border: none !important;
  border-radius: 0px !important;
  z-index: 99998 !important;
  transition: left 0.3s ease-in-out !important;
  box-shadow: 10px 0 30px rgba(0, 0, 0, 0.5) !important;
  overflow: visible !important;
  padding: 40px 0 28px 0 !important;
  
  /* Apply the SpaceX geometric notch clip-path directly to the sidebar panel edge! */
  clip-path: polygon(
    0 0, 
    90% 0, 
    90% 120px, 
    100% 150px, 
    100% 80%, 
    90% 85%, 
    90% 100%, 
    0 100%
  ) !important;
}

/* Slide in active state */
html body.woocommerce-account .g2g-woocommerce-myaccount .woocommerce-MyAccount-navigation.open {
  left: 0 !important;
}

/* Full Width Grid on WooCommerce My Account */
html body.woocommerce-account .g2g-woocommerce-myaccount {
  display: block !important;
}

/* Sibling Toggle Handle Button - Slides with the sidebar drawer using fixed positioning */
html body.woocommerce-account .piximplanet-offcanvas-toggle {
  display: inline-flex !important;
  position: fixed !important; 
  top: 120px !important; /* Vertically centered to cover the 120px-150px angled notch segment of the drawer! */
  left: 0px !important; /* Starts flat against the left screen boundary when closed */
  width: 26px !important;
  height: 60px !important; 
  padding: 0 !important;
  margin: 0 !important;
  background-color: var(--galactic-card-bg) !important;
  background: var(--galactic-card-bg) !important;
  border: none !important;
  border-radius: 0px !important; /* Shape is defined by clip-path */
  color: transparent !important; /* Completely clean - no text or icons */
  z-index: 99999 !important;
  cursor: pointer !important;
  transition: left 0.3s ease-in-out, background-color 0.1s, opacity 0.1s !important;
  text-decoration: none !important;
  
  /* Clean angled notch shape with NO burger icon SVG */
  clip-path: polygon(
    0 0,
    10% 0,
    100% 30px,
    10% 60px,
    0 60px
  ) !important;
}

/* Make it transparent and non-overlapping when open, allowing the underlying active link's blue background
   to be clipped naturally by the sidebar's notch border with no navy block overlap */
html body.woocommerce-account .piximplanet-offcanvas-toggle.active {
  left: 234px !important; 
  background-color: transparent !important;
  background: transparent !important;
  pointer-events: auto !important; /* Still clickable to close */
  box-shadow: none !important;
}

/* Hover style for the clean notched button trigger */
html body.woocommerce-account .piximplanet-offcanvas-toggle:hover {
  background-color: var(--galactic-blue) !important;
  background: var(--galactic-blue) !important;
}

html body.woocommerce-account .piximplanet-offcanvas-toggle.active:hover {
  background-color: rgba(255, 255, 255, 0.05) !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

/* Overlay Backdrop */
html body.woocommerce-account .piximplanet-offcanvas-overlay {
  display: none;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background-color: rgba(5, 8, 20, 0.7) !important;
  z-index: 99997 !important;
  opacity: 0;
  transition: opacity 0.3s ease !important;
  pointer-events: none;
}

html body.woocommerce-account .piximplanet-offcanvas-overlay.active {
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  cursor: pointer;
}

/* =========================================================
   CLEANUP & DARK THEME FIT FOR MY ACCOUNT
   ========================================================= */

/* Remove any remaining sidebar styling since we removed it from PHP */
html body.woocommerce-account .woocommerce-MyAccount-navigation {
  display: none !important;
}

/* Force My Account Content wrapper to be transparent and full width */
html body.woocommerce-account .woocommerce-MyAccount-content {
  background-color: transparent !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

/* Force Recent Orders Panel and general cards to match dark theme */
html body.woocommerce-account .g2g-recent-orders-panel,
html body.woocommerce-account .g2g-quick-card,
html body.woocommerce-account .config-card {
  background-color: var(--galactic-card-bg) !important;
  background: var(--galactic-card-bg) !important;
  border: 1px solid var(--galactic-border) !important;
  border-radius: 4px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important;
  color: var(--galactic-text) !important;
  padding: 24px !important;
}

/* Style table element inside the dark card */
html body.woocommerce-account table.shop_table,
html body.woocommerce-account table.woocommerce-orders-table {
  background-color: transparent !important;
  border: none !important;
  color: #ffffff !important;
}

html body.woocommerce-account table.shop_table th,
html body.woocommerce-account table.woocommerce-orders-table th {
  background-color: var(--galactic-dark-navy) !important;
  color: #ffffff !important;
  border-bottom: 1px solid var(--galactic-border) !important;
}

html body.woocommerce-account table.shop_table td,
html body.woocommerce-account table.woocommerce-orders-table td {
  background-color: transparent !important;
  color: #b0b8c4 !important;
  border-bottom: 1px solid var(--galactic-border) !important;
}

/* Form Inputs styling */
html body.woocommerce-account input.input-text,
html body.woocommerce-account textarea,
html body.woocommerce-account select {
  background-color: rgba(8, 12, 18, 0.5) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
  border-radius: 4px !important;
}

html body.woocommerce-account input.input-text:focus,
html body.woocommerce-account textarea:focus,
html body.woocommerce-account select:focus {
  border-color: var(--galactic-accent) !important;
  outline: none;
}

/* Header Main Navigation Styling to prevent white background */
#planet-header-ui-root .main-nav,
html body .main-nav {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

#planet-header-ui-root .nav-link,
#planet-header-ui-root .nav-link span,
html body .main-nav .nav-link,
html body .main-nav .nav-link span {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--galactic-text-muted) !important;
}

#planet-header-ui-root .nav-link:hover,
#planet-header-ui-root .nav-link:hover span,
html body .main-nav .nav-link:hover,
html body .main-nav .nav-link:hover span {
  background: rgba(0, 240, 255, 0.05) !important;
  color: #ffffff !important;
  text-shadow: none !important;
}

#planet-header-ui-root .nav-link i,
html body .main-nav .nav-link i {
  color: var(--galactic-text-muted) !important;
  opacity: 0.8 !important;
}

#planet-header-ui-root .nav-link:hover i,
html body .main-nav .nav-link:hover i {
  color: var(--galactic-accent) !important;
  opacity: 1 !important;
}

/* Header Main Navigation Hover Dropdowns */
#planet-header-ui-root .menu-item-wrapper,
html body .main-nav .menu-item-wrapper {
   position: relative !important;
   height: 100% !important;
   display: flex !important;
   align-items: center !important;
}

#planet-header-ui-root .sub-menu-dropdown,
html body .main-nav .sub-menu-dropdown {
   position: absolute !important;
   top: 100% !important;
   left: 0 !important;
   background: #020208 !important; /* Cosmic dark background */
   border: 1px solid rgba(0, 240, 255, 0.15) !important;
   border-top: none !important;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
   min-width: 220px !important;
   display: none !important;
   flex-direction: column !important;
   padding: 10px 0 !important;
   z-index: 99999 !important;
   backdrop-filter: blur(10px) !important;
}

#planet-header-ui-root .menu-item-wrapper:hover .sub-menu-dropdown,
html body .main-nav .menu-item-wrapper:hover .sub-menu-dropdown {
   display: flex !important;
}

#planet-header-ui-root .sub-nav-link,
html body .main-nav .sub-nav-link {
   display: flex !important;
   align-items: center !important;
   gap: 8px !important;
   padding: 10px 20px !important;
   color: var(--galactic-text-muted) !important;
   text-decoration: none !important;
   font-family: var(--font-tech) !important;
   font-size: 13px !important;
   font-weight: 600 !important;
   letter-spacing: 1px !important;
   transition: all 0.2s !important;
   width: 100% !important;
   box-sizing: border-box !important;
   background: transparent !important;
}

#planet-header-ui-root .sub-nav-link:hover,
html body .main-nav .sub-nav-link:hover {
   background: rgba(0, 240, 255, 0.08) !important;
   color: #ffffff !important;
   padding-left: 25px !important; /* Hover slide effect */
}

#planet-header-ui-root .sub-nav-link i,
html body .main-nav .sub-nav-link i {
   color: var(--galactic-text-muted) !important;
   opacity: 0.8 !important;
}

#planet-header-ui-root .sub-nav-link:hover i,
html body .main-nav .sub-nav-link:hover i {
   color: var(--galactic-accent) !important;
   opacity: 1 !important;
}

/* Vertical Category Menu (Browse Modules) Dropdown Flyouts & Link Colors */
#planet-header-ui-root .browse-modules-wrapper .menu-list {
   position: relative !important;
}

#planet-header-ui-root .browse-modules-wrapper .menu-item {
   position: relative !important;
}

#planet-header-ui-root .browse-modules-wrapper .sub-menu {
   position: absolute !important;
   top: 0 !important;
   left: 100% !important; /* Fly out to the right */
   background: #020208 !important;
   border: 1px solid rgba(0, 240, 255, 0.15) !important;
   min-width: 220px !important;
   display: none !important;
   flex-direction: column !important;
   padding: 10px 0 !important;
   z-index: 999999 !important;
   box-shadow: 10px 10px 30px rgba(0, 0, 0, 0.5) !important;
   backdrop-filter: blur(10px) !important;
   margin: 0 !important;
   list-style: none !important;
}

#planet-header-ui-root .browse-modules-wrapper .menu-item:hover > .sub-menu {
   display: flex !important;
}

/* Force styling and colors for flyout category submenu links */
#planet-header-ui-root .browse-modules-wrapper .sub-menu a,
#planet-header-ui-root .browse-modules-wrapper .sub-menu li a,
html body .browse-modules-wrapper .sub-menu a,
html body .browse-modules-wrapper .sub-menu li a {
   display: block !important;
   padding: 8px 20px !important;
   color: var(--galactic-text-muted) !important;
   text-decoration: none !important;
   font-family: var(--font-tech) !important;
   font-size: 13px !important;
   font-weight: 500 !important;
   letter-spacing: 0.5px !important;
   transition: all 0.2s !important;
   text-align: left !important;
   background: transparent !important;
   width: 100% !important;
   box-sizing: border-box !important;
}

#planet-header-ui-root .browse-modules-wrapper .sub-menu a:hover,
#planet-header-ui-root .browse-modules-wrapper .sub-menu li a:hover,
html body .browse-modules-wrapper .sub-menu a:hover,
html body .browse-modules-wrapper .sub-menu li a:hover {
   background: rgba(0, 240, 255, 0.08) !important;
   color: #ffffff !important;
   padding-left: 25px !important;
}

/* Horizontal Mega Menu Columns Grid */
#planet-header-ui-root .sub-menu-dropdown.mega-menu-grid,
html body .main-nav .sub-menu-dropdown.mega-menu-grid {
   display: none !important;
   flex-direction: row !important;
   gap: 40px !important;
   padding: 25px 30px !important;
   min-width: 600px !important;
}

#planet-header-ui-root .menu-item-wrapper:hover .sub-menu-dropdown.mega-menu-grid,
html body .main-nav .menu-item-wrapper:hover .sub-menu-dropdown.mega-menu-grid {
   display: flex !important;
}

#planet-header-ui-root .mega-menu-column,
html body .main-nav .mega-menu-column {
   display: flex !important;
   flex-direction: column !important;
   gap: 12px !important;
   min-width: 180px !important;
}

#planet-header-ui-root .mega-menu-column-title,
html body .main-nav .mega-menu-column-title {
   font-family: var(--font-tech) !important;
   font-size: 13px !important;
   font-weight: 800 !important;
   color: #ffffff !important;
   text-transform: uppercase !important;
   letter-spacing: 1px !important;
   padding-bottom: 8px !important;
   border-bottom: 1px solid rgba(0, 240, 255, 0.15) !important;
   margin-bottom: 5px !important;
   text-decoration: none !important;
   transition: all 0.2s !important;
}

#planet-header-ui-root .mega-menu-column-title:hover,
html body .main-nav .mega-menu-column-title:hover {
   color: var(--galactic-accent) !important;
}

#planet-header-ui-root .mega-menu-column-links,
html body .main-nav .mega-menu-column-links {
   display: flex !important;
   flex-direction: column !important;
   gap: 8px !important;
}

#planet-header-ui-root .mega-menu-column-links a,
html body .main-nav .mega-menu-column-links a {
   font-family: var(--font-tech) !important;
   font-size: 12px !important;
   font-weight: 500 !important;
   color: var(--galactic-text-muted) !important;
   text-decoration: none !important;
   transition: all 0.2s !important;
   padding: 2px 0 !important;
   text-align: left !important;
}

#planet-header-ui-root .mega-menu-column-links a:hover,
html body .main-nav .mega-menu-column-links a:hover {
   color: var(--galactic-accent) !important;
   padding-left: 5px !important;
}

/* Force Top Promo Bar & Header background to match dark cosmic theme on Account Page */
body.woocommerce-account .header_top_area,
body.woocommerce-account .top-header,
body.woocommerce-account .top-bar,
body.woocommerce-account .header-top,
body.woocommerce-account .header_top_wrap {
  background-color: #020205 !important;
  background: #020205 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

body.woocommerce-account header,
body.woocommerce-account .logo-section-menu,
body.woocommerce-account .logo_section_wrap,
body.woocommerce-account .header_wrap {
  background-color: #020205 !important;
  background: #020205 !important;
}