/*
Theme Name: Hello Elementor Child
Template: hello-elementor
*/

/* ------------------- GLOBAL RESET ------------------- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}


/* ---------- Heading Styles 
h1 {
  font-size: 20px !important;

}

---------- */

h2 {
  font-size: 0 !important;
  line-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  display: none !important;
}

body {
  font-family: Arial, sans-serif;
  background-color: #fff;
  color: #000;
  line-height: 1.4;
  padding: 0px;
}


body h3 {
  font-size: 1.5rem !important;
  margin-left: 20px !important;
  margin-bottom: 5px !important;
}

/* ------------------- EXTRA BITS TO STICK FOOTER TO BOTTOM -------------------*/
html, body {
  height: 100%;
  margin: 0;
}

.site {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.site-main {
  flex: 1;
}

/* -------------------------------------*/

td.bottom-right {
  background-color: orange !important;
  color: black !important;; /* optional for contrast */
  font-weight: bold !important;; /* optional for emphasis */
}


/* ------------------- HEADER -------------------*/

.site-header {
      width: 100vw !important;
      max-width: 100vw !important;
        margin: 0 !important;
  background-color: #003366;
  color: white;
 padding: 8px 0;
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
} 


.container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 5px !important;   /* 👈 10px left + right padding */
  max-width: 1200px;
  margin: 0;
}



.branding {
  display: flex;
  align-items: center;
  gap: 5px !important;
  justify-content: flex-start;
}


.logo img {
  display: block;
  height: 50px !important;
  max-height: 50px !important;
  width: auto !important;
}


.company-name h1 {
  font-size: 20px !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

/* ------------------- FOOTER ------------------- */
.site-footer {
       width: 100vw !important;
      max-width: 100vw !important;
        margin: 0 !important;
  background-color: #000000;
  color: #ffffff;
  text-align: center;
  padding: 16px 0;
  font-size: 14px;
   margin-top: auto;
}

.site-footer a {
  color: #ffffff;
  text-decoration: none;
}

.site-footer a:hover {
  color: #ffcc00;
}



/* ------------------- NAVIGATION - lIKE PAGES ------------------- */


.navigation {
margin-left: 10px;  /*  👈 This nudges it right */
}

.navigation ul {
  list-style: none;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.navigation li a {
  text-decoration: none;
  color: white;
  font-size: 14px;
  transition: color 0.3s ease;
}

.navigation li a:hover {
  color: #ffcc00;
}

/* ------------------- FORM ------------------- */
form {
  padding: 0;
}

.selection-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 10px 0 10px 20px;
}

.selection-container button {
  margin-left: 20px; /* Adjust this value as needed */
}




#selection {
  padding: 3px;
  border: 2px solid black;
  font-size: 13px;
  width: 100px;
}

/* ------------------- INPUTS ------------------- */
    input:-webkit-autofill {
      box-shadow: 0 0 0px 1000px white inset !important;
      background-color: white !important;
      -webkit-text-fill-color: black !important;
      transition: background-color 9999s ease-in-out 0s;
    }


input::placeholder {
  color: #aaa;
  opacity: 1;
}
input::-webkit-input-placeholder {
  color: #aaa;
}
input:-ms-input-placeholder {
  color: #aaa;
}
input::-ms-input-placeholder {
  color: #aaa;
}





/* ------------------- BUTTON ------------------- */
form button[type="submit"],
form input[type="submit"] {
  background-color: #0055a5 !important;
  color: #ffffff !important;
  padding: 10px 24px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border: none !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  transition: all 0.2s ease-in-out !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}


form button[type="submit"]:hover,
form input[type="submit"]:hover {
  background-color: #003f7d !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

form button[type="submit"]:active,
form input[type="submit"]:active {
  transform: scale(0.98) !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}






/* ------------------- TABLE STYLE ------------------- */


/* ------------------- ADDING A LIITLE TABLE OVERRIDE FOR COMMENTS to 10px------------------- */



/* ------------------- COLUMN WIDTHS (percentages to fit all 7) ------------------- */


/* ------------------- COLORS ------------------- */

.hidden-row {
  display: none;
}

/* ------------------- INDENTS ------------------- */


/* ------------------- NO STACKING ON MOBILE ------------------- */

  
  /* ------------------- FULL WIDTH HEADER ON LARGER SCREENS ------------------- */


  /* ------------------- CALCULATOR NOTE ------------------- */

.calculator-summary {
  border: 1px solid #000;
  padding: 8px;
  margin: 20px auto;
  max-width: 700px;
 background-color: #eeeeee; /* Light grey background */
  font-size: 11px; /* Matches table font size */
  color: black; /* Optional: white text for contrast */
}

.calculator-summary h4 {
  margin-top: 0;
  margin-bottom: 6px;
  font-size: 12px; /* Slightly larger for the heading */
  color: #003366;
    font-size: 12px; /* Matches table font size */
}

.calculator-summary p {
  margin: 0;
  text-indent: 10px;
}


  /* ------------------- REMOVE ELEMENTOR HEADING LIKE "ARCHIVE" ----------- */
  .archive .elementor-heading-title,
.archive .page-title,
.archive .entry-title {
  display: none !important;
}

  /* ------------------- EXTRA ----------- */
  
  





}