/** Shopify CDN: Minification failed

Line 25:2 Expected ":"
Line 26:2 Expected ":"
Line 27:2 Expected ":"
Line 28:2 Expected ":"
Line 29:2 Expected ":"
Line 30:2 Expected ":"
Line 31:2 Expected ":"
Line 32:2 Expected ":"
Line 38:2 Expected ":"
Line 39:2 Expected ":"
... and 37 more hidden warnings

**/
/*
=========================================
== FANTASY ROYALE - MILSOFT GAMES
== SHOPIFY THEME OVERRIDES (V23 - Fix: Individual Rounded Section Boxes - FINAL ATTEMPT)
=========================================
*/

/* --- 1. SET BRAND COLORS AS CSS VARIABLES (Unchanged) --- */
:root {
  --primary-brand-color: #FFDE59;
  --dark-blue-bg: #1d1f33; /* Content Box Background */
  --light-text-color: #F0F2F5;
  --subtle-text-color: #A9B1C2;
  --button-orange: #FF8C00;
  --button-hover: #0056b3;
  --body-bg-dark: #220933; /* Solid background color */
  --section-break-bg: #11041a;
}

/* --- 2. GLOBAL STYLES --- */

body {
  background-color: var(--body-bg-dark) !important;
  color: var(--light-text-color) !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* --- Header & Footer (Kept separate from content sections) --- */
.header, .footer {
  background-color: var(--section-break-bg) !important; 
    /* Ensure they are full width */
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 20px 0 !important; 
}
.footer {
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* --- Typography & Links (Unchanged) --- */
body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, 
.button, input, textarea, select, .card__heading, 
.footer__heading, .header__heading {
  font-family: 'Lato', sans-serif !important;
}

a, .link {
  color: var(--primary-brand-color) !important;
  text-decoration: none;
}
a:hover, .link:hover {
  color: var(--light-text-color) !important;
  text-decoration: underline;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, 
.card__heading, .footer__heading, .header__heading {
  color: var(--light-text-color) !important;
}

/* --- 3. COMPONENT STYLES (Unchanged) --- */

.button--primary,
.shopify-payment-button__button {
  background-color: var(--button-orange) !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 5px !important;
}
.button--primary:hover {
  background-color: var(--button-hover) !important;
}

.button--secondary {
  background-color: transparent !important;
  color: var(--primary-brand-color) !important;
  border: 1px solid var(--primary-brand-color) !important;
  border-radius: 5px !important;
}
.button--secondary:hover {
  background-color: var(--primary-brand-color) !important;
  color: var(--body-bg-dark) !important;
}

input, textarea, select, .select__select {
  background-color: rgba(255, 255, 255, 0.1) !important; 
  color: var(--light-text-color) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 5px !important;
}

hr, .product__info-container .price, .cart-item, .totals > * {
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Card backgrounds are now set to a dark color for better contrast */
.card,
.card-wrapper,
.customer .card,
.collection-hero__inner,
.cart__contents,
.cart__footer {
  background-color: var(--dark-blue-bg) !important; 
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 10px !important;
}


/* =========================================
== 5. INDIVIDUAL SECTION BOX STYLING
=========================================
*/

/* --- FIX 1: Remove background and padding from the outer section --- */
main .shopify-section {
  background: none !important;
  padding: 0 !important;
  /* Crucial: Ensure the section container has a minimum height to avoid collapse */
  min-height: 1px !important; 
}


/*
 * --- FIX 2: Target the inner page-width container (The individual Box) ---
 * Makes the inner container the visible, centered, rounded content box.
 */
main .page-width {
  /* FIX: Use a consistent color for the content background (the blue box). */
  background: var(--dark-blue-bg) !important; 
  
  box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.4) !important;
  max-width: 1400px !important;
  width: calc(100% - 40px) !important;
  padding: 40px 50px !important; 
  box-sizing: border-box !important;
  
  /* Ensure horizontal center and set top/bottom margin for separation */
  margin: 20px auto 20px auto !important;
  border-radius: 15px !important; /* Rounded corners for every section */
  
  /* AGGRESSIVE OVERRIDE: Prevent potential negative margins or padding from collapsing the box */
  min-height: 1px !important;
  display: block !important; 
}

/* Cleanup for potential conflicting styles (keeping all corners rounded for every box) */
main .shopify-section:first-child .page-width,
main .shopify-section:last-child .page-width {
    border-radius: 15px !important;
}