/* =============================================
   DIERKS INDUSTRIES - CLEAN THEME SYSTEM
   ============================================= */

/* ===== DEFAULT THEME (DARK MODE) ===== */
:root {
    /* Cassiopeia Core Overrides */
    --cassiopeia-color-primary: #1a1008;
    --cassiopeia-color-link: #e8a855;
    --cassiopeia-color-hover: #ffd080;
    --cassiopeia-color-active: #ffffff;

    /* Extended palette */
    --color-bg: #2b2118;
    --color-surface: #332218;
    --color-text: #f0d5b0;
    --color-text-muted: #c0a080;
    --color-heading: #e8c89a;

    /* Buttons */
    --btn-bg: #7a4a20;
    --btn-hover: #8f5a2a;
    --btn-border: #5c3d20;
    
    /* Joomla Core Components Fallback */
    --card-bg: var(--color-surface);
    --card-color: var(--color-text);
}

/* ===== ALTERNATE THEME (LIGHT MODE) ===== */
html.light-theme {
    /* Softer warm background */
    --color-bg: #efe8dd;
    --color-surface: #f7f3ed;

    /* Text */
    --color-text: #2b2a28;
    --color-text-muted: #6b645c;
    --color-heading: #1f1e1c;

    /* Header / nav */
    --cassiopeia-color-primary: #f3ede4;

    /* Links */
    --cassiopeia-color-link: #7a4a20;
    --cassiopeia-color-hover: #5c3a1a;
    --cassiopeia-color-active: #1a1008;

    /* Buttons */
    --btn-bg: #7a4a20;
    --btn-hover: #8f5a2a;
    --btn-border: #5c3d20;
}

/* ---- LAYOUT CORE & TYPOGRAPHY ---- */
body {
    background-color: var(--color-bg);
    color: var(--color-text);
    transition: background-color 0.35s ease, color 0.35s ease;
}

/* Headings */
.page-header h1, h1, h2, h3, h4, h5, h6 {
    color: var(--color-heading);
}

/* Text Elements */
p, li, td, th, label {
    color: var(--color-text);
    font-size: 1.05rem;
    line-height: 1.7;
}

/* ---- HEADER & CENTERED LOGO ---- */
.header,
.container-header,
header.container-header {
    background: var(--cassiopeia-color-primary) !important;
    border-bottom: none !important;
}

/* Stacks logo and nav and centers them */
.header .grid-child {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* Logo Sizing & Centering */
.navbar-brand {
    margin-right: 0 !important;
    padding-bottom: 1rem;
    display: block;
}

.navbar-brand img {
    height: 120px;
    width: auto;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .navbar-brand img {
        height: 70px;
    }
}

/* ---- NAVIGATION ---- */
.navbar {
    background-color: var(--cassiopeia-color-primary) !important;
    justify-content: center; /* Centers the menu items */
}

.navbar a {
    color: var(--cassiopeia-color-link) !important;
}

.navbar a:hover,
.navbar a:focus {
    color: var(--cassiopeia-color-hover) !important;
}

/* ===== ACTIVE MENU ===== */
.header .navbar a.active,
.header .navbar .nav-link.active,
.header .navbar a[aria-current="page"],
.container-nav a.active,
.container-nav .nav-link.active,
.container-nav a[aria-current="page"] {
    color: var(--cassiopeia-color-active) !important;
    font-weight: 600 !important;
    border-bottom: 3px solid var(--cassiopeia-color-link) !important;
    padding-bottom: 4px !important;
    display: inline-block;
}

html.light-theme .header .navbar a.active,
html.light-theme .header .navbar .nav-link.active,
html.light-theme .header .navbar a[aria-current="page"] {
    color: #1a1008 !important;
}

/* Smooth transitions */
.header,
.container-header,
.footer,
.container-footer,
.navbar,
.container-component,
.breadcrumb {
    transition: background-color 0.35s ease, color 0.35s ease;
}

/* Main content container */
.container-component,
.site-grid .container-component {
    background-color: var(--color-surface);
    padding: 20px;
    border-radius: 4px;
}

/* ---- LINKS ---- */
a {
    color: var(--cassiopeia-color-link);
}

a:hover {
    color: var(--cassiopeia-color-hover);
}

a:visited {
    color: #c87840 !important;
}
html.light-theme a:visited {
    color: #5c3a1a !important;
}

/* ---- BREADCRUMBS ---- */
.breadcrumb {
    background-color: var(--cassiopeia-color-primary) !important;
}

.breadcrumb-item a {
    color: var(--cassiopeia-color-link) !important;
}

.breadcrumb-item.active {
    color: var(--color-text) !important;
}

/* ---- BUTTONS ---- */
.btn-primary {
    background-color: var(--btn-bg) !important;
    border-color: var(--btn-border) !important;
    color: #ffffff !important;
}

.btn-primary:hover {
    background-color: var(--btn-hover) !important;
}

/* ---- FOOTER ---- */
/* 1. Target the main layout row wrapper to kill the CSS grid spacer heights */
.site-grid, 
body.site {
    grid-row-gap: 0 !important; /* Forces the layout rows to compress together tightly */
}

/* 2. Strip ALL background layout paddings and heights from footer wrappers */
.footer,
.container-footer,
footer.container-footer,
footer.footer.full-width {
    background: var(--cassiopeia-color-primary) !important;
    color: var(--color-text-muted) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    min-height: 0 !important;
    height: auto !important;
}

/* 3. Drop layout child constraint defaults */
footer.footer .grid-child,
footer.footer .grid-child * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: auto !important;
}

/* 4. This now holds total exclusive control over your visible footer banner height */
.di-footer {
    text-align: center !important;
    width: 100% !important;
    padding: 0.5rem 0 !important; /* Shrink this to 0.25rem if you want it even thinner */
    color: var(--color-text-muted) !important;
    display: block !important;
}

/* Clean up any paragraph tag spacing breaking out of your inline styling */
.di-footer p {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important; /* Lowers line-height height profile */
}

/* ---- CONTACT PAGE ---- */
.com-contact_articles,
.com-contact .mod-menu,
.com-contact ul.mod-menu {
    display: none !important;
}

/* LIGHT MODE DEPTH IMPROVEMENTS */
html.light-theme .container-component {
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    border: 1px solid rgba(0,0,0,0.05);
}

/* =============================================
   NEW: CUSTOM THEME TOGGLE INTERFACE
   ============================================= */
.theme-toggle {
    background: var(--color-surface);
    border: 2px solid var(--cassiopeia-color-link);
    border-radius: 50%;
    width: 44px;  
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    color: var(--cassiopeia-color-link);
    transition: all 0.25s ease-in-out;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.theme-toggle span.fa {
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-size: 1.25rem !important; 
    line-height: 1 !important;
    display: inline-block !important;
}

.theme-toggle:hover {
    background-color: var(--cassiopeia-color-link);
    color: var(--cassiopeia-color-primary) !important;
    transform: scale(1.05);
}

.theme-toggle .theme-icon-sun { display: inline-block !important; }
.theme-toggle .theme-icon-moon { display: none !important; }

html.light-theme .theme-toggle .theme-icon-sun { display: none !important; }
html.light-theme .theme-toggle .theme-icon-moon { display: inline-block !important; }

/* =============================================
   REPLACED: LOGO SWITCHING IS NOW IN INDEX.PHP
   ============================================= */
/* html.light-theme .navbar-brand img {
    content: url('/images/dierks_industries_logo_light.png') !important; 
}
*/