/* ========================================    
   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: #333333;    
  margin: 0;    
  padding: 0;    
  line-height: 1.3;    
}
    
.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: #1868DB;    
  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: #145AB8;    
}
    
.custom-help-button:focus-visible {    
  outline: 3px solid #1868DB;    
  outline-offset: 2px;    
}
    
.custom-header-description {    
  max-width: 100%;    
  margin: 0 0 30px 0;    
  padding: 15px 0;    
  background-color: #f5f5f5;    
  border-top: 1px solid #E0E0E0;    
  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: #333333;    
  line-height: 1.5;    
}
    
.custom-header-description p:last-child {    
  margin-bottom: 0;    
}
    
.custom-header-description strong {    
  color: #333333;    
  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 #E0E0E0 !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: #1868DB !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: #145AB8 !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 #1868DB;    
  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 #E0E0E0;    
}
    
.tab-btn {    
  background: none;    
  border: none;    
  padding: 12px 24px;    
  font-size: 16px;    
  font-weight: 500;    
  font-family: 'Clario', Arial, sans-serif;    
  cursor: pointer;    
  color: #757575;    
  border-bottom: 3px solid transparent;    
  margin-bottom: -2px;    
  transition: all 0.3s ease;    
}
    
.tab-btn.active {    
  color: #333333;    
  border-bottom: 3px solid #D64000;    
  background-color: transparent !important;    
}
    
.tab-btn:hover:not(.active) {    
  color: #333333;    
  background-color: #E5F5FF;    
}
    
.tab-btn:focus-visible {    
  outline: 3px solid #1868DB;    
  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: 14px;    
  color: #757575;    
  font-family: 'Clario', Arial, sans-serif;    
}
    
#powered-by-placeholder .page-footer a {    
  color: #1868DB !important;    
  text-decoration: none;    
}
    
#powered-by-placeholder .page-footer a:hover {    
  color: #145AB8 !important;    
  text-decoration: underline;    
}
    
#powered-by-placeholder .page-footer a:focus-visible {    
  outline: 3px solid #1868DB;    
  outline-offset: 2px;    
}