/* --- BRUTE FORCE LAYOUT FIX --- */
/* Kill dead space, orange borders, and create black void + metal rack */

/* --- 1. KILL DEAD SPACE (Top & Sides) --- */
html, body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

/* --- 2. THE VOID (Subtle Metal Texture Background) --- */
body {
    background-color: #050505 !important; /* Pitch black base */
    /* Add subtle metal texture to the void (faded way back) */
    background-image: url('https://pub-cf83109acdfe4a0fbecf1fb8fc73f559.r2.dev/brushed%20metal%20for%20web%20background/Gemini_Generated_Image_isebidisebidiseb%20(3).png') !important;
    background-repeat: repeat !important;
    background-size: 500px auto !important;
    background-attachment: fixed !important;
    /* Overlay heavy black so texture is barely visible */
    position: relative !important;
}

body::before {
    content: "" !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0,0,0,0.85) !important; /* 85% black overlay */
    pointer-events: none !important;
    z-index: -1 !important;
}

/* --- 3. KILL THE ORANGE BORDER --- */
/* Target every possible container to ensure that border dies */
.rack-left-rail, 
.rack-right-rail {
    display: none !important;
}

/* --- 4. THE CHASSIS (Metal Rack Unit) --- */
.master-rack-chassis {
    /* LAYERED BACKGROUND: Dark center for text, light edges for metal texture */
    /* LAYER 1: Gradient vignette (dark center, transparent edges) */
    /* LAYER 2: Metal texture (underneath) */
    background-image: 
        linear-gradient(
            90deg, 
            rgba(0,0,0,0.2) 0%,   /* Left Edge: Shows more metal texture */
            rgba(0,0,0,0.9) 20%,  /* Start Dark Zone for text readability */
            rgba(0,0,0,0.9) 80%,  /* End Dark Zone */
            rgba(0,0,0,0.2) 100%  /* Right Edge: Shows more metal texture */
        ),
        url('https://pub-cf83109acdfe4a0fbecf1fb8fc73f559.r2.dev/brushed%20metal%20for%20web%20background/Gemini_Generated_Image_isebidisebidiseb%20(3).png') !important;
    
    background-repeat: no-repeat, repeat-y !important;
    background-size: 100% 100%, 100% auto !important;
    background-blend-mode: normal !important;
    background-color: #1a1a1a !important;
    
    /* Define the edges */
    max-width: 1100px !important;
    margin: 0 auto !important;
    margin-top: 20px !important; /* Space from top */
    margin-bottom: 20px !important;
    
    /* Prepare for pseudo-element rack ears */
    position: relative !important; /* Anchor for the ears */
    border: none !important;
    overflow: visible !important; /* Let ears hang off the side */
    
    /* Depth shadow only */
    box-shadow: 0 0 50px rgba(0,0,0,0.8) !important;
    
    /* Ensure text remains legible */
    color: #e0e0e0 !important;
}

/* --- 4a. LEFT RACK EAR (Graphic with bolts) --- */
.master-rack-chassis::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: -40px !important; /* Pull it out to the left */
    width: 40px !important; /* Width of the ear */
    
    /* The actual graphic (metal strip with bolt holes) */
    background-image: url('https://pub-cf83109acdfe4a0fbecf1fb8fc73f559.r2.dev/brushed%20metal%20for%20web%20background/Gemini_Generated_Image_isebidisebidiseb.png') !important;
    background-size: 100% 100% !important; /* Stretch to full height */
    background-repeat: no-repeat !important;
    
    z-index: 100 !important; /* Sit above background, below buttons */
    pointer-events: none !important; /* Don't block clicks */
}

/* --- 4b. RIGHT RACK EAR (Flipped graphic) --- */
.master-rack-chassis::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    right: -40px !important; /* Pull it out to the right */
    width: 40px !important; /* Width of the ear */
    
    /* Same graphic, flipped horizontally */
    background-image: url('https://pub-cf83109acdfe4a0fbecf1fb8fc73f559.r2.dev/brushed%20metal%20for%20web%20background/Gemini_Generated_Image_isebidisebidiseb.png') !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    transform: scaleX(-1) !important; /* FLIP IT to look like the right side */
    
    z-index: 100 !important;
    pointer-events: none !important; /* Don't block clicks */
}

/* --- 5. HEADER IMAGE FLUSH TOP --- */
.rack-header-img {
    display: block !important;
    width: 100% !important;
    margin-top: 0 !important;
}

/* --- 6. TEXT VISIBILITY --- */
.master-rack-chassis p, 
.master-rack-chassis h1, 
.master-rack-chassis h2,
.master-rack-chassis h3,
.master-rack-chassis li,
.master-rack-chassis label,
.master-rack-chassis span {
    color: #e0e0e0 !important; /* Ensure text pops against the dark metal */
    text-shadow: 0 1px 2px rgba(0,0,0,0.8); /* subtle depth */
}

/* --- 7. Z-INDEX ELEVATION (Keep buttons & links above metal texture) --- */
a, 
button, 
.book-now-button, 
.rack-cta-button, 
input, 
select,
.nav-button {
    position: relative !important;
    z-index: 1000 !important;
}

/* --- 8. NAVIGATION BAR LAYERING --- */
.rack-header-nav {
    position: relative !important;
    z-index: 900 !important;
}

/* --- 9. BUTTON STYLING (High contrast for visibility) --- */
.book-now-button,
.rack-cta-button,
button[type="submit"] {
    background: #000 !important;
    border: 2px solid #FF9F1C !important;
    color: #FF9F1C !important;
    font-weight: 700 !important;
    text-shadow: 0 0 8px rgba(255, 159, 28, 0.6) !important;
    box-shadow: 
        0 0 12px rgba(255, 159, 28, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
    cursor: pointer !important;
}

.book-now-button:hover,
.rack-cta-button:hover,
button[type="submit"]:hover {
    background: #1a1a1a !important;
    border-color: #FFB84D !important;
    color: #FFB84D !important;
    box-shadow: 
        0 0 20px rgba(255, 184, 77, 0.6),
        inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}