/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

/* Custom CSS for Nexus Cart
 *
 * This block allows you to customize theme colors and styles for the entire Nexus Cart template.
 *
 * To customize colors:
 * - Replace the var() references with your own hex colors or other CSS values.
 * - For example, instead of --primary: #4b5563; use --primary: #your-color;
 * - You can also override any CSS properties here.
 */

/* Custom CSS for 285Servers.best theme */
/* Add your custom styles here */

/* Example:
.primary-bg-color {
    background-color: #your-color;
}
*/
/* ===== 285Servers Color Override (WHMCS) ===== */

/* Background */
body,
.main-content,
#main-body,
.container,
.container-fluid {
    background-color: #09090f !important;
    color: #ffffff !important;
}

/* Cards / Panels */
.card,
.panel,
.tile,
.list-group,
.sidebar .panel,
.client-home-panels .panel,
.well,
.thumbnail { /* Added .well and .thumbnail for older WHMCS components */
    background-color: #111117 !important;
    border-color: #1f1f2e !important;
    color: #ffffff !important;
}

/* Card headers */
.card-header,
.panel-heading,
.list-group-item {
    background-color: #111117 !important;
    border-color: #1f1f2e !important;
    color: #ffffff !important;
}

/* ===== WHITE BOX DESTROYERS (WHMCS & Bootstrap specific) ===== */
.card-body,
.panel-body,
.list-group-item:not(.active),
.list-group-item-action,
.bg-light,
.bg-white,
.logincontainer,
.sub-sidebar,
#order-standard_cart {
    background-color: #111117 !important;
    color: #ffffff !important;
    border-color: #1f1f2e !important;
}

/* Fix for nested lists or table elements inside wrappers */
.table-responsive, 
.dataTables_wrapper {
    background-color: #111117 !important;
    border: none !important;
}

/* Text */
p,
.text-muted,
.small,
label,
.form-group label {
    color: #8888a8 !important;
}

/* Links */
a {
    color: #00f0ff !important;
}
a:hover {
    color: #00b8c4 !important;
}

/* Buttons */
.btn-primary,
.btn-success {
    background-color: #00f0ff !important;
    border-color: #00f0ff !important;
    color: #09090f !important;
}

.btn-primary:hover,
.btn-success:hover {
    background-color: #00b8c4 !important;
    border-color: #00b8c4 !important;
}

/* Secondary / default buttons */
.btn-default,
.btn-secondary {
    background-color: #111117 !important;
    border-color: #1f1f2e !important;
    color: #ffffff !important;
}

/* Forms */
input.form-control,
select.form-control,
textarea.form-control {
    background-color: #111117 !important;
    border-color: #1f1f2e !important;
    color: #ffffff !important;
}

input::placeholder {
    color: #8888a8 !important;
}

/* Tables */
.table {
    background-color: #111117 !important;
    color: #ffffff !important;
}

.table th,
.table td {
    border-color: #1f1f2e !important;
}

/* Navbar */
.navbar,
.main-header,
.header {
    background-color: #09090f !important;
    border-color: #1f1f2e !important;
}

/* Footer */
.footer {
    background-color: #09090f !important;
    border-top: 1px solid #1f1f2e !important;
}

/* Badges */
.badge-success,
.label-success {
    background-color: rgba(0, 240, 255, 0.15) !important;
    color: #00f0ff !important;
}

.badge-danger,
.label-danger {
    background-color: rgba(255, 0, 56, 0.15) !important;
    color: #ff0038 !important;
}

/* ===== FORCE LOGO OVERRIDE ===== */
.navbar-brand img {
    content: url("https://cdn.discordapp.com/attachments/1191129218004832459/1505577894028640327/285_Servers_logo.png?ex=6a0b222e&is=6a09d0ae&hm=660d532ee83632d067aea1f5f95c5b6744e43c722f94683c08ffbdfca29bc2a7&") !important;
    max-height: 50px !important;
    width: auto !important;
}
/* ===== HOME PAGE CARD & BREADCRUMB FIXES ===== */

/* Fixes the white homepage grid blocks (Announcements, Network Status, etc.) */
.home-shortcut,
a.home-shortcut,
.home-shortcut .tiles {
    background-color: #111117 !important;
    border-color: #1f1f2e !important;
    color: #ffffff !important;
}

/* Fixes text and icons inside those homepage blocks from disappearing */
.home-shortcut .title, 
.home-shortcut i, 
.home-shortcut .icon,
.home-shortcut div {
    color: #00f0ff !important; /* Changes the text labels and icons to match your bright cyan accent */
}

/* Fixes the bright white breadcrumb navigation bar below the header */
.breadcrumb-wrapper,
.breadcrumb,
.breadcrumb-container,
#main-body > .header-lined {
    background-color: #111117 !important;
    border-color: #1f1f2e !important;
    color: #ffffff !important;
}

/* Fixes the "Portal Home" text color inside the dark breadcrumb bar */
.breadcrumb li,
.breadcrumb li a,
.breadcrumb-item,
.breadcrumb-item a {
    color: #8888a8 !important;
}

.breadcrumb li.active,
.breadcrumb-item.active {
    color: #ffffff !important;
}
/* ===== Fix WHMCS remaining white areas ===== */

/* Breadcrumb white bar */
.master-breadcrumb,
.breadcrumb {
    background-color: #09090f !important;
    border: none !important;
}

.breadcrumb,
.breadcrumb-item,
.breadcrumb a,
.master-breadcrumb a {
    color: #8888a8 !important;
}

/* White help tiles */
.home-shortcuts,
.home-shortcuts .lead,
.home-shortcuts .icon,
.home-shortcuts a,
.tiles .tile,
.tile,
.card-accent,
.card-accent-teal,
.card-accent-blue,
.card-accent-orange,
.card-accent-pink,
.card-accent-green {
    background-color: #111117 !important;
    color: #ffffff !important;
    border-color: #1f1f2e !important;
}

/* Shortcut boxes/cards */
.home-shortcuts .col-sm-4,
.home-shortcuts .col-md-3,
.home-shortcuts .col-lg,
.home-shortcuts .item,
.home-shortcuts a {
    background-color: #111117 !important;
    border-color: #1f1f2e !important;
}

/* Icons inside shortcut boxes */
.home-shortcuts i,
.home-shortcuts .fas,
.home-shortcuts .far,
.home-shortcuts .fad {
    color: #00f0ff !important;
}

/* Product/service cards */
.product-groups .card,
.product-groups .list-group-item,
.card-body,
.product-group,
.product {
    background-color: #111117 !important;
    color: #ffffff !important;
    border-color: #1f1f2e !important;
}

/* Fix random light strips */
section,
.main-body,
#main-body,
.primary-content,
div[role="main"] {
    background-color: #09090f !important;
}

/* Inputs/search box polish */
.search .form-control,
.input-group .form-control {
    background-color: #111117 !important;
    color: #ffffff !important;
    border-color: #8888a8 !important;
}


/* ===== 285SERVERS ACTION ICON BUTTONS FIX ===== */

/* Target the container row and every single accent card variation inside it */
.action-icon-btns a,
.action-icon-btns [class^="card-accent-"],
.card-accent-sun-flower,
.card-accent-asbestos,
.card-accent-pomegranate,
.card-accent-midnight-blue {
    background-color: #111117 !important;
    background: #111117 !important;
    border: 1px solid #1f1f2e !important;
    color: #ffffff !important;
}

/* Make sure all the icons inside these specific rows pop with your brand's cyan */
.action-icon-btns .ico-container i,
.action-icon-btns a i,
.action-icon-btns fa-book,
.action-icon-btns fa-download {
    color: #00f0ff !important;
}

/* Force hover states so they don't flash white when clicked or moused over */
.action-icon-btns a:hover {
    background-color: #161622 !important;
    border-color: #00f0ff !important;
}

/* ===== COMPLETE FORM FIELD & INPUT PURGE ===== */

/* Force all input variants, autofills, and form states to match the theme */
input,
select,
textarea,
.form-control,
input.form-control,
select.form-control,
#main-body input,
#main-body select,
#main-body textarea,
[class*="form-control"] {
    background-color: #111117 !important;
    background: #111117 !important;
    border: 1px solid #1f1f2e !important;
    color: #ffffff !important;
}

/* Fixes browser autofill forcing input boxes back to light yellow/white colors */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    -webkit-text-fill-color: #ffffff !important;
    -webkit-box-shadow: 0 0 0px 1000px #111117 inset !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* Ensure placeholder text stays legible instead of fading out */
input::placeholder,
.form-control::placeholder {
    color: #8888a8 !important;
    opacity: 1 !important;
}

/* Fix active/focus states so the boxes don't blink white when clicked */
input:focus, 
select:focus, 
textarea:focus,
.form-control:focus {
    background-color: #111117 !important;
    border-color: #00f0ff !important; /* Glows cyan when active */
    color: #ffffff !important;
    outline: none !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 240, 255, 0.25) !important;
}

/* ===== ABSOLUTE STRUCTURAL PURGE ===== */

/* Targets any div or section within the main content block that has an implicit white background */
#main-body div, 
.main-content div,
.container-fluid div,
.view-cart-empty,
div[class*="summary"],
div[class*="sidebar"] {
    /* If the browser is trying to render a white or light-grey box here, force it dark */
    background-color: #111117 !important;
    background: #111117 !important;
    border-color: #1f1f2e !important;
}

/* Ensure text elements inside these specific deep-nested boxes don't vanish */
#main-body div *, 
.main-content div * {
    color: #ffffff; /* Sets fallback text to white */
}

/* Maintain your specific gray accent color for descriptions/muted text */
#main-body div .text-muted,
#main-body div label,
#main-body div .small {
    color: #8888a8 !important;
}

/* Keep form inputs dark even when nested inside newly fixed structural elements */
#main-body input,
#main-body select,
#main-body textarea {
    background-color: #111117 !important;
    color: #ffffff !important;
}
/* ===== PROMO CODE TAB FIX ===== */

/* Targets the individual tab button/link itself */
.nav-tabs .nav-item a,
.nav-tabs .nav-link,
#order-standard_cart .nav-tabs > li > a,
#order-standard_cart .nav-tabs > li.active > a {
    background-color: #111117 !important;
    background: #111117 !important;
    border: 1px solid #1f1f2e !important;
    border-bottom-color: transparent !important; /* Keeps the tab look seamless */
    color: #00f0ff !important; /* Makes the "Apply Promo Code" text use your brand cyan */
}

/* Ensure it stays dark and retains the cyan border when clicked/active */
.nav-tabs .nav-link.active,
#order-standard_cart .nav-tabs > li.active > a,
#order-standard_cart .nav-tabs > li.active > a:hover,
#order-standard_cart .nav-tabs > li.active > a:focus {
    background-color: #111117 !important;
    background: #111117 !important;
    color: #00f0ff !important;
    border-color: #1f1f2e !important;
    border-bottom-color: #111117 !important; /* Blends the active tab into the container below it */
}

/* ===== ANNOUNCEMENT ARTICLE CONTAINER FIX ===== */

/* Targets the announcement post body container and its background frames */
.announcement-single,
.announcements,
#main-body article,
.announcement-single + div,
div[class*="announcement"] .card,
div[class*="announcement"] {
    background-color: #111117 !important;
    background: #111117 !important;
    border-color: #1f1f2e !important;
    color: #ffffff !important;
}

/* Fix any inner paragraphs or blockquotes inside the announcement body text */
.announcement-single p,
#main-body article p,
.announcement-single div {
    color: #ffffff !important;
}

/* Keeps subtle text or dates inside the announcement gray and legible */
.announcement-single .text-muted,
.announcement-single small {
    color: #8888a8 !important;
}

/* ===== INPUT GROUP ICON OVERRIDES ===== */

/* Targets the white background square wrapped around the login field icons */
.input-group-prepend .input-group-text,
.input-group-append .input-group-text,
.input-group-text {
    background-color: #1a1a24 !important; /* Slightly lighter dark than the input for a subtle contrast */
    border-color: #1f1f2e !important;
}

/* Force the FontAwesome icons themselves to glow with your brand's cyan accent */
.input-group-text i,
.input-group-text .fas,
.input-group-text .far,
.input-group-text .fal,
.input-group-text .fad {
    color: #00f0ff !important;
}

/* ===== NAVBAR DROPDOWN FIXES ===== */

/* Targets the main dropdown container wrapper */
.dropdown-menu,
.navbar-nav .dropdown-menu,
[class*="dropdown-menu"] {
    background-color: #111117 !important;
    background: #111117 !important;
    border: 1px solid #1f1f2e !important;
}

/* Fixes the links inside the dropdown menu */
.dropdown-menu a,
.dropdown-item,
.dropdown-menu .dropdown-item {
    color: #ffffff !important; /* Changes the light cyan on white to clean white text on dark */
    background-color: transparent !important;
}

/* Adds a nice hover effect to dropdown items matching your theme style */
.dropdown-menu a:hover,
.dropdown-item:hover,
.dropdown-item:focus {
    background-color: #161622 !important;
    color: #00f0ff !important; /* Highlights with your signature brand cyan on hover */
}

/* Fixes the subtle divider lines if there are any inside your menus */
.dropdown-divider {
    border-top: 1px solid #1f1f2e !important;
}

/* ===== BANNER LAYOUT PURGE CATCH-ALL ===== */

/* Force the wrapper container of the email verification block dark */
.email-verification,
[class*="verifyemail"],
[id*="verifyemail"],
.verify-email-banner,
section.email-verification {
    background-color: #09090f !important;
    background: #09090f !important;
    border: none !important;
}

/* Target any unclassed 100% width layout divs that sit right above the main content grid */
header + div,
#header + div,
.main-navbar-wrapper + div,
.navbar + div {
    background-color: #09090f !important;
    background: #09090f !important;
    border: none !important;
}

/* Ensure the layout block doesn't inherit a background white color from any parent wrappers */
#main-body-container > div:first-child,
body > .text-center {
    background-color: #09090f !important;
    background: #09090f !important;
}
/* ===== LOGGED IN ACCOUNT DROPDOWN OVERRIDE ===== */

/* Targets the dropdown menu container specifically when logged in */
.navbar-nav .dropdown-menu,
#header .dropdown-menu,
.dropdown-menu {
    background-color: #111117 !important;
    background: #111117 !important;
    border: 1px solid #1f1f2e !important;
}

/* Fixes the user link items inside the dropdown list */
.dropdown-menu a.dropdown-item,
.dropdown-item {
    color: #00f0ff !important; /* Keeps your crisp cyan theme links readable */
    background-color: transparent !important;
}

/* Adds a sleek hover state to highlight items cleanly */
.dropdown-menu a.dropdown-item:hover,
.dropdown-item:hover {
    background-color: #1a1a24 !important;
    color: #ffffff !important; /* Swaps to clean white text on hover */
}
/* ===== DATATABLES & GRID OVERRIDES ===== */

/* Targets the main table headers and table body rows */
.table,
table.dataTable,
table.dataTable m_table,
.table-responsive table {
    background-color: #111117 !important;
    background: #111117 !important;
    color: #ffffff !important;
    border-color: #1f1f2e !important;
}

/* Fixes the header cells (e.g., "Date Sent", "Subject") */
table.dataTable Learning th,
table.dataTable thead th,
.table thead th,
.table th {
    background-color: #161622 !important;
    color: #00f0ff !important; /* Highlights headers with your signature cyan */
    border-bottom: 2px solid #1f1f2e !important;
    border-top: none !important;
}

/* Fixes individual table cells and data rows */
table.dataTable tbody td,
.table tbody td,
.table td {
    background-color: #111117 !important;
    color: #ffffff !important;
    border-top: 1px solid #1f1f2e !important;
}

/* Tames the aggressive white/gray alternating zebra striping */
table.dataTable.table-striped tbody tr:nth-of-type(odd),
.table-striped tbody tr:nth-of-type(odd) {
    background-color: #13131c !important; /* Extremely subtle alternate dark tint */
}

/* Ensures hover states on table rows look premium instead of flashing white */
table.dataTable.table-hover tbody tr:hover,
.table-hover tbody tr:hover {
    background-color: #1a1a26 !important;
    color: #00f0ff !important;
}

/* Fixes the table control wrappers (e.g., "Showing 1 to 8 of 8 entries") */
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_paginate {
    color: #8888a8 !important;
}
/* ===== DATATABLE PAGINATION OVERRIDES ===== */

/* Targets the container and individual pagination buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button,
.pagination .page-item .page-link,
.pagination > li > a,
.pagination > li > span {
    background-color: #111117 !important;
    background: #111117 !important;
    border: 1px solid #1f1f2e !important;
    color: #00f0ff !important; /* Forces your brand cyan text */
}

/* Fixes the "Active" current page square (the number 1 in the middle) */
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.pagination .page-item.active .page-link,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
    background-color: #1a1a24 !important;
    background: #1a1a24 !important;
    border-color: #00f0ff !important; /* Gives the active item a subtle cyan border highlight */
    color: #ffffff !important;
}

/* Hover effects for the Previous, Next, and inactive number buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.pagination .page-item .page-link:hover,
.pagination > li > a:hover,
.pagination > li > span:hover {
    background-color: #161622 !important;
    background: #161622 !important;
    color: #ffffff !important; /* Flips text to white when hovered */
    border-color: #1f1f2e !important;
}

/* Handles the styling for disabled buttons (like "Previous" when on page 1) */
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.pagination .page-item.disabled .page-link {
    background-color: #0d0d12 !important;
    background: #0d0d12 !important;
    color: #44445c !important; /* Mutes the text color drastically so users know it's unclickable */
    border-color: #1f1f2e !important;
    opacity: 0.6;
}

/* ===== SIDEBAR BADGE FIXES ===== */

/* Targets the white pill/badge bubbles in the sidebar menus */
.list-group-item .badge,
.list-group-item .badge-pill,
[class*="list-group"] .badge,
.sidebar .badge {
    background-color: #1a1a24 !important; /* Matches your dark input addon blocks */
    color: #00f0ff !important;            /* Forces the count text to pop in your signature cyan */
    border: 1px solid #1f1f2e !important; /* Adds a clean, subtle border */
    font-weight: 600 !important;
}

/* If you want them to highlight differently when hovering over the menu row */
.list-group-item:hover .badge {
    background-color: #00f0ff !important;
    color: #111117 !important;            /* Inverts colors on hover for an interactive feel */
    border-color: #00f0ff !important;
}