/*
 Theme Name:     Firefly Child Theme
 Theme URI:      https://www.madebyfirefly.ca
 Description:    Child Theme
 Author:         Corby Simpson
 Author URI:     www.corbysimpson.com
 Template:       firefly
 Version:        1.0.0
*/

/* Import Parent Theme Styles */
@import url("../firefly-child/style.css");

/* General Styles */
#main-footer {
    display: none !important; /* Hide footer */
}

.et_pb_gutters3 .et_pb_column_4_4 .et_pb_blog_grid .column.size-1of3, .et_pb_gutters3.et_pb_row .et_pb_column_4_4 .et_pb_blog_grid .column.size-1of3 {
        width: 29.65%;
}

header .et_builder_inner_content {
    z-index: 9999; /* Ensure Mega Menu dropdown is on top */
}

hr {
    color: #eee;
}

table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

th, td {
    padding: 12px;
    text-align: left;
}

.et_pb_text ol, .et_pb_text ul {
    margin: 0 0 0 20px;
}

li {
    margin-bottom: 1em;
}

#header-logo {
    display: block;
    float: left;
}

#main-navigation {
    width: 750px;
    float: right;
}

 .menu-rule {border: 0; border-top: 1px dotted #aaa}

/* Popup Search Box */
#et-boc .area-outer-wrap .da-close {
    font-size: 50px;
    height: 30px;
    line-height: 60px;
    width: 60px;
}

#et-boc .area-outer-wrap[data-da-color=light] .da-close {
    background: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: none;
}

#et-boc .area-outer-wrap[data-da-color=light] .da-close:focus, #et-boc .area-outer-wrap[data-da-color=light] .da-close:hover {
    background: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: none;
}

/* Hide the text from the search button */
.et_pb_search.search-box-icon-button .et_pb_searchsubmit {
    text-indent: -9999px; /* This hides the button text off-screen */
    overflow: hidden; /* Ensure no scrolling within the button */
    background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D"http%3A//www.w3.org/2000/svg" viewBox%3D"0 0 64 64"%3E%3Cpath fill%3D"%232f8fff" d%3D"M55%2C51.6l-9.9-9.8c1.5-2.4%2C2.3-5.2%2C2.3-8.1c0-7.7-6.3-14-14-14s-14%2C6.3-14%2C14c0%2C7.7%2C6.3%2C14%2C14%2C14c2.9%2C0%2C5.7-0.8%2C8.1-2.3l9.9%2C9.9c0.6%2C0.6%2C1.4%2C0.9%2C2.2%2C0.9s1.6-0.3%2C2.2-0.9C55.6%2C54.1%2C55.6%2C52.8%2C55%2C51.6zM33.4%2C42.7c-5.1%2C0-9.3-4.1-9.3-9.3s4.1-9.3%2C9.3-9.3c5.1%2C0%2C9.3%2C4.1%2C9.3%2C9.3S38.5%2C42.7%2C33.4%2C42.7z"/%3E%3C/svg%3E');
    background-repeat: no-repeat;
    background-position-x: 5px; /* Adjust icon horizontal position */
    background-position-y: 5px; /* Adjust icon vertical position */
    width: 41px; /* Adjust width as needed */
    height: 41px; /* Adjust height as needed */
}

/* Two Column Lists */
.two-columns {
    columns: 2;
    column-gap: 20px;
    padding-left: 0;
}

.two-columns li {
    position: relative;
    padding-left: 0.5em;
}

.two-columns li::marker {
    margin-left: -1.5em;
}

.blog-disclaimer {padding: 0 8vw;}

/* Headings */
h1 {font-size: 100px !important;}
.smallHeading h1 {font-size: 60px !important;}

h2, h3 {
    padding-top: 20px;
}

h3 {
    font-size: 19px;
}

.single-post h2, .single-post h3 {
    font-weight: 700 !important;
    line-height: 1.4em;
}

footer h2, footer h3 {
    font-weight: 400 !important;
    padding-top: 20px;
}

.et_pb_post .entry-featured-image-url,
.et_pb_image_container {
    margin-bottom: 0;
}

/* Custom Boxes */
.strategy-box {
    background-color: #f7fafc;
    border-left: 4px solid #ea6a39;
    padding: 1.5em;
    margin: 1.5em;
    border-radius: 0 4px 4px 0;
}

.important-note {
    background-color: #ebf8ff;
    padding: 1.5em;
    border-radius: 4px;
    margin: 1.5em 0;
}

/* TL;DR Section */
.summary {
    background-color: #f7fafc;
    border-left: 4px solid #4299e1;
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.summary h2 {
    color: #2c5282;
    margin: 0 0 1rem;
}

.summary-list {
    display: grid;
    gap: 0.75rem;
    margin-top: 1rem;
}

.summary-item {
    display: flex;
    gap: 0.5rem;
}

.number {
    color: #4299e1;
    font-weight: bold;
}

/*****************************/
/* Calculator Tables */

.data-table td, .data-table th {
    color: #bbbbbb;
}

/*****************************/
/* Table */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 2rem 0;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border: 0;
}

 th {
    background-color: #ea6a39;
    color: #fff;
    padding: 1rem;
    text-align: left;
}

 td {
    padding: 1rem;
    border-bottom: 1px solid #e2e8f0;
    color:#666;
}

 tr:nth-child(even) {
    background-color: #f7fafc;
}

/*****************************/
/* Light Theme Table Styling */
.comparison-table-light {
    width: 100%;
    border-collapse: collapse;
    margin: 2rem 0;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.comparison-table-light th {
    background-color: #ea6a39;
    color: #fff;
    padding: 1rem;
    text-align: left;
}

.comparison-table-light td {
    padding: 1rem;
    border-bottom: 1px solid #e2e8f0;
}

.comparison-table-light tr:nth-child(even) {
    background-color: #f7fafc;
}

/****************************/
/* Dark Theme Table Styling */
.table-wrapper {
    width: 100%;
    overflow-x: auto; /* Enable horizontal scrolling */
    -webkit-overflow-scrolling: touch; /* Smooth scrolling for iOS devices */
}

/* Table Styling */
.comparison-table-dark {
    width: 100%;
    background-color: #4f4f4f; /* Lightened table background to stand out */
    border-collapse: collapse; /* Merged borders */
    color: #ffffff; /* Default text color set to white */
    text-align: left;
    border-radius: 12px; /* Rounded corners for the table */
    overflow: hidden; /* Prevents overflow from rounding */
}

/* Header Styling */
.comparison-table-dark th {
    background-color: #1e1e1e; /* Slightly lighter gray for headers */
    color: #ffffff; /* White text for maximum contrast */
    font-size: 16px;
    padding: 15px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-bottom: 2px solid #008080; /* Teal accent border for headers */
    border-top-left-radius: 12px; /* Rounded top left corner */
    border-top-right-radius: 12px; /* Rounded top right corner */
}

/* Body Cell Styling */
.comparison-table-dark td {
    padding: 15px;
    color: #ffffff; /* White text color for readability */
    font-size: 15px;
}

/* Alternating Row Colors */
.comparison-table-dark tbody tr:nth-child(odd) {
    background-color: #383838; /* Brighter background for odd rows */
}

.comparison-table-dark tbody tr:nth-child(even) {
    background-color: #434343; /* Brighter background for even rows */
}

/* Rounded Corners for Bottom Cells */
.comparison-table-dark tbody tr:last-child td:first-child {
    border-bottom-left-radius: 8px; /* Rounded bottom left corner */
}

.comparison-table-dark tbody tr:last-child td:last-child {
    border-bottom-right-radius: 8px; /* Rounded bottom right corner */
}

/* Custom Style for Header & Footer Cells */
.comparison-table-dark th,
.comparison-table-dark td:last-child {
    font-weight: 600; /* Bold text for emphasis */
}

/* Section Header Styling */
.section-header {
    background-color: #008080; /* Teal accent */
    color: white; /* White text for contrast */
    font-weight: bold; /* Bold text */
    text-align: center; /* Center align text */
    font-size: 18px; /* Adjust font size for better visibility */
    padding: 10px; /* Add some padding */
    border-bottom: 2px solid #444; /* Subtle border for separation */
}

/* Enhanced Focus for Accessibility */
.comparison-table-dark td:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 128, 128, 0.5); /* Teal focus ring */
}

/* Sticky Header */
.stick {
    position: sticky;
    top: 0;
}

/* Responsive Styles */
@media (max-width: 600px) {
    .comparison-table-light th, 
    .comparison-table-light td {
        font-size: 14px;
    }
}

@media screen and (max-width: 1350px) {
    #et_pb_image_0_tb_header {
        padding-bottom: 30px;
    }

    #main-navigation {
        width: 80px;
        padding-top: 15px;
    }

    #header-logo {
        width: 200px;
    }
}

@media screen and (max-width: 768px) {
    .et_pb_row {
        width: 90%;
    }

    .blog-disclaimer {padding: 0 4vw;}

    .two-columns {
        columns: 1;
    }
    h1 {font-size: 50px !important;}
    .smallHeading h1 {font-size: 30px !important;}
}