/* ========================================  
   HEADER  
   ======================================== */
  
.page-header,  
.page-header::before,  
.page-header::after {  
  display: none !important;  
}
  
.custom-header-container {  
  background-color: #ffffff;  
  border-bottom: none !important;  
  margin-bottom: 0 !important;  
}
  
.custom-header-content {  
  max-width: 1200px;  
  margin: 0 auto;  
  padding: 20px 20px 10px 20px;  
  display: flex;  
  align-items: center;  
  justify-content: space-between;  
  flex-wrap: wrap;  
  background-color: #ffffff;  
}
  
.custom-logo {  
  flex: 0 0 auto;  
}
  
.header-logo-img {  
  height: 40px;  
  width: auto;  
  display: block;  
}
  
.custom-page-title {  
  flex: 0 0 100%;  
  order: 3;  
  margin-left: 0;  
  margin-top: 15px;  
  text-align: center;  
}
  
.custom-page-title h1 {  
  font-size: 24px;  
  font-weight: 500;  
  font-family: 'Clario', Arial, sans-serif;  
  color: #212223;  
  margin: 0;  
  padding: 0;  
}
  
.custom-header-actions {  
  flex: 0 0 auto;  
  display: flex;  
  align-items: center;  
  gap: 12px;  
  margin-left: auto;  
}
  
.custom-help-button {  
  display: inline-block;  
  padding: 10px 20px;  
  background-color: #0088FF;  
  color: white !important;  
  text-decoration: none;  
  border-radius: 4px;  
  font-size: 14px;  
  font-weight: 500;  
  font-family: 'Clario', Arial, sans-serif;  
  cursor: pointer;  
  transition: background-color 0.2s ease;  
  white-space: nowrap;  
  border: 2px solid transparent;  
}
  
.custom-help-button:hover {  
  background-color: #0077E6;  
}
  
.custom-help-button:focus-visible {  
  outline: 3px solid #0088FF;  
  outline-offset: 2px;  
}
  
.custom-header-description {  
  max-width: 100%;  
  margin: 0 0 30px 0;  
  padding: 15px 0;  
  background-color: #f5f5f5;  
  border-top: 1px solid #e5e5e5;  
  border-bottom: none;  
}
  
.custom-header-description p {  
  max-width: 850px;  
  margin: 0 auto 12px auto;  
  padding: 0 40px;  
  font-size: 14px;  
  font-family: 'Clario', Arial, sans-serif;  
  color: #212223;  
  line-height: 1.5;  
}
  
.custom-header-description p:last-child {  
  margin-bottom: 0;  
}
  
.custom-header-description strong {  
  color: #212223;  
  font-weight: 500;  
  font-family: 'Clario', Arial, sans-serif;  
}
  
/* ========================================  
   SUBSCRIBE MODAL (BASIC STYLING ONLY)  
   ======================================== */
  
/* REMOVED: 250+ lines of tab manipulation logic (old workaround) */
  
#subscribe-button-placeholder .updates-dropdown-container > button,  
#subscribe-button-placeholder .updates-dropdown-container > a.show-updates-dropdown {  
  display: inline-block;  
  padding: 10px 20px;  
  background-color: #D64000 !important;  
  color: white !important;  
  text-decoration: none;  
  border-radius: 4px;  
  font-size: 14px;  
  font-weight: 500;  
  font-family: 'Clario', Arial, sans-serif;  
  cursor: pointer;  
  transition: background-color 0.2s ease;  
  border: 2px solid transparent;  
  white-space: nowrap;  
}
  
#subscribe-button-placeholder .updates-dropdown-container > button:hover,  
#subscribe-button-placeholder .updates-dropdown-container > a.show-updates-dropdown:hover {  
  background-color: #C23800 !important;  
}
  
#subscribe-button-placeholder .updates-dropdown-container > button:focus-visible,  
#subscribe-button-placeholder .updates-dropdown-container > a.show-updates-dropdown:focus-visible {  
  outline: 3px solid #D64000;  
  outline-offset: 2px;  
}
  
#subscribe-button-placeholder .updates-dropdown-container {  
  display: inline-block !important;  
  position: relative;  
}
  
#subscribe-button-placeholder .updates-dropdown {  
  position: absolute !important;  
  top: 100% !important;  
  right: 0 !important;  
  left: auto !important;  
  margin-top: 10px !important;  
  z-index: 9999 !important;  
  max-height: 80vh !important;  
  overflow-y: auto !important;  
  background-color: #ffffff !important;  
  box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;  
  border-radius: 4px !important;  
  padding: 20px !important;  
  min-width: 400px !important;  
  border: 1px solid #e5e5e5 !important;  
  box-sizing: border-box !important;  
}
  
@media (max-width: 750px) {  
  #subscribe-button-placeholder .updates-dropdown {  
    position: fixed !important;  
    top: 50% !important;  
    left: 50% !important;  
    right: auto !important;  
    transform: translate(-50%, -50%) !important;  
    width: 90vw !important;  
    max-width: 500px !important;  
    min-width: 0 !important;  
    margin: 0 !important;  
  }  
}
  
@media (max-width: 480px) {  
  #subscribe-button-placeholder .updates-dropdown {  
    width: calc(100% - 40px) !important;  
    max-width: none !important;  
    padding: 15px !important;  
  }  
}
  
@media (max-width: 360px) {  
  #subscribe-button-placeholder .updates-dropdown {  
    width: calc(100% - 20px) !important;  
    padding: 12px !important;  
  }  
}
  
#subscribe-button-placeholder .updates-dropdown a[href*="privacy"],  
#subscribe-button-placeholder .updates-dropdown a[href*="terms"],  
#subscribe-button-placeholder .updates-dropdown a[href*="support"],  
#subscribe-button-placeholder .terms_and_privacy_information a,  
#subscribe-button-placeholder .updates-dropdown-section.support a,  
#subscribe-button-placeholder .updates-dropdown-section.atom a {  
  background-color: transparent !important;  
  color: #0088FF !important;  
  padding: 0 !important;  
  border-radius: 0 !important;  
  border: none !important;  
  text-decoration: underline !important;  
  display: inline !important;  
  font-size: inherit !important;  
  font-weight: normal !important;  
  min-width: auto !important;  
}
  
#subscribe-button-placeholder .updates-dropdown a[href*="privacy"]:hover,  
#subscribe-button-placeholder .updates-dropdown a[href*="terms"]:hover,  
#subscribe-button-placeholder .updates-dropdown a[href*="support"]:hover {  
  color: #0077E6 !important;  
  background-color: transparent !important;  
}
  
#subscribe-button-placeholder .updates-dropdown a[href*="privacy"]:focus-visible,  
#subscribe-button-placeholder .updates-dropdown a[href*="terms"]:focus-visible,  
#subscribe-button-placeholder .updates-dropdown a[href*="support"]:focus-visible {  
  outline: 3px solid #0088FF;  
  outline-offset: 2px;  
}
  
#subscribe-button-placeholder .updates-dropdown input[type="submit"],  
#subscribe-button-placeholder .updates-dropdown button.flat-button {  
  background-color: #D64000 !important;  
  color: white !important;  
  padding: 10px 20px !important;  
  border-radius: 4px !important;  
  border: none !important;  
  font-weight: 500 !important;  
  font-family: 'Clario', Arial, sans-serif;  
  cursor: pointer !important;  
  display: block !important;  
}
  
#subscribe-button-placeholder .updates-dropdown input[type="submit"]:hover,  
#subscribe-button-placeholder .updates-dropdown button.flat-button:hover {  
  background-color: #C23800 !important;  
}
  
#subscribe-button-placeholder .updates-dropdown input[type="submit"]:focus-visible,  
#subscribe-button-placeholder .updates-dropdown button.flat-button:focus-visible {  
  outline: 3px solid #D64000;  
  outline-offset: 2px;  
}
  
/* ========================================  
   FOOTER TABS  
   ======================================== */
  
.page-footer {  
  position: relative;  
  order: 999 !important;  
  margin-top: 40px !important;  
  min-height: auto !important;  
  padding-bottom: 20px !important;  
}
  
#custom-tabbed-footer {  
  max-width: 850px;  
  margin: 10px auto 0;  
  padding: 0 0 50px 0;  
  width: 100%;  
  box-sizing: border-box;  
  position: relative;  
  z-index: 1;  
}
  
.tab-content-wrapper {  
  width: 100%;  
  min-height: 80px;  
  padding-bottom: 30px;  
} 
  
.tab-navigation {  
  width: 100%;  
  margin: 0 0 30px 0;  
  display: flex;  
  border-bottom: 2px solid #E5E5E5;  
}
  
.tab-btn {  
  background: none;  
  border: none;  
  padding: 12px 24px;  
  font-size: 16px;  
  font-weight: 500;  
  font-family: 'Clario', Arial, sans-serif;  
  cursor: pointer;  
  color: #7A7A7A;  
  border-bottom: 3px solid transparent;  
  margin-bottom: -2px;  
  transition: all 0.3s ease;  
}
  
.tab-btn.active {  
  color: #212223;  
  border-bottom: 3px solid #D64000;  
  background-color: transparent !important;  
}
  
.tab-btn:hover:not(.active) {  
  color: #212223;  
  background-color: #E5F5FF;  
}
  
.tab-btn:focus-visible {  
  outline: 3px solid #0088FF;  
  outline-offset: -3px;  
}
  
.tab-count {  
  font-weight: 400;  
  margin-left: 5px;  
}
  
.tab-content {  
  display: none;  
}
  
.tab-content.active {  
  display: block;  
}
  
#scheduled-maintenance-content .scheduled-maintenances-container,  
#past-incidents-content .incidents-list,  
#past-incidents-content .incidents-container {  
  display: block !important;  
}
  
.incidents-list:not(#past-incidents-content .incidents-list),  
.scheduled-maintenances-container:not(#scheduled-maintenance-content .scheduled-maintenances-container) {  
  display: none !important;  
}
  
/* ========================================  
   BOTTOM CONTAINER (INCIDENT HISTORY + POWERED BY)  
   ======================================== */
  
#bottom-container-wrapper {  
  max-width: 850px;  
  margin: 40px auto 20px;  
  padding: 0 20px;  
  display: flex;  
  justify-content: space-between;  
  align-items: center;  
  gap: 20px;  
  position: relative;  
  z-index: 2;  
}
  
@media (max-width: 768px) {  
  #bottom-container-wrapper {  
    flex-direction: column;  
    align-items: flex-start;  
    gap: 15px;  
  }  
}
  
#incident-history-link-container {  
  flex: 0 0 auto;  
}
  
#powered-by-placeholder {  
  flex: 0 0 auto;  
  margin-left: auto;  
}
  
@media (max-width: 768px) {  
  #powered-by-placeholder {  
    margin-left: 0;  
    align-self: flex-start;  
  }  
}
  
#incident-history-link-container a {  
  display: inline-flex;  
  align-items: center;  
  gap: 6px;  
  padding: 10px 15px;  
  background-color: #ffffff;  
  color: #D64000 !important;  
  text-decoration: none;  
  border-radius: 4px;  
  font-size: 14px;  
  font-weight: 500;  
  font-family: 'Clario', Arial, sans-serif;  
  transition: all 0.2s ease;  
  border: 2px solid #D64000;  
  white-space: nowrap;  
}
  
#incident-history-link-container a:hover {  
  background-color: #FFF4E0;  
  border-color: #C23800;  
  color: #C23800 !important;  
}
  
#incident-history-link-container a:focus-visible {  
  outline: 3px solid #D64000;  
  outline-offset: 2px;  
}
  
.history-footer-link:not(#incident-history-link-container .history-footer-link) {  
  display: none !important;  
}
  
.page-footer:not(#powered-by-placeholder .page-footer) {  
  display: none !important;  
}
  
#powered-by-placeholder .page-footer {  
  margin: 0 !important;  
  padding: 0 !important;  
  border: none !important;  
  background: transparent !important;  
  min-height: auto !important;  
  position: static !important;  
}
  
#powered-by-placeholder .page-footer .powered-by {  
  margin: 0 !important;  
  padding: 0 !important;  
  font-size: 12px;  
  color: #7A7A7A;  
  font-family: 'Clario', Arial, sans-serif;  
}
  
#powered-by-placeholder .page-footer a {  
  color: #0088FF !important;  
  text-decoration: none;  
}
  
#powered-by-placeholder .page-footer a:hover {  
  color: #0077E6 !important;  
  text-decoration: underline;  
}
  
#powered-by-placeholder .page-footer a:focus-visible {  
  outline: 3px solid #0088FF;  
  outline-offset: 2px;  
}