/* =========================================
   1. Load Custom Brand Fonts
   ========================================= */
@font-face {
  font-family: 'PostGrotesk';
  src: url('https://headway-production-public-assets.s3.us-east-2.amazonaws.com/fonts/PostGrotesk-Book.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Honey Regular';
  src: url('https://headway-production-public-assets.s3.us-east-2.amazonaws.com/fonts/VCHoney-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}

/* =========================================
   2. Global Resets & Body
   ========================================= */
body, p, a, span, div, .page-title, .incident-title {
  font-family: "PostGrotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-weight: 400;
}

ul {
  list-style-type: disc;
  margin-left: 1.5rem;
}

/* =========================================
   3. The Header (Masthead) - FIXED
   ========================================= */

/* === REMOVED EXTRA PADDING TO FIX WHITE GAP === */
.masthead-container,
.masthead-container.premium {
  background-image: none !important;
  border-bottom: none !important;
  text-align: left !important;
}

/* === WHITE TEXT + HONEY FONT for "Status Page" === */
.masthead-container .page-name,
.masthead-container .page-name a,
.masthead-container .text-container span,
.masthead-container .title {
  font-family: "Honey Regular", serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: -0.02em !important;
  color: #ffffff !important;
  text-shadow: none !important;
  text-decoration: none !important;
   
  /* Mobile Size (UPDATED) */
  font-size: 34px !important;    /* Increased from 28px */
  line-height: 38px !important;  /* Adjusted from 32px */
  margin: 0 !important;
}

/* === VERTICAL CENTERING FIX (The "Nudge" Method) === */
@media screen and (min-width: 768px) {
  /* 1. Font Size Adjustment for Desktop */
  .masthead-container .page-name,
  .masthead-container .page-name a,
  .masthead-container .text-container span,
  .masthead-container .title {
    font-size: 40px !important;
    line-height: 52px !important; /* This is the height we are matching */
    padding-inline: 0 !important;
  }

  /* 2. Push the button down to center it with the 52px text */
  .masthead-container .action-bar {
      margin-top: 10px !important; 
      padding-bottom: 0 !important;
      float: right !important; 
  }
}

/* =========================================
   4. Headings (H1-H6)
   ========================================= */
h1, h2, h3, h4, h5, h6 {
  font-family: "Honey Regular", serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em;
}

/* =========================================
   5. Status Banner Customization (Green Box)
   ========================================= */

/* The Outer Box */
.page-status.status-none {
  padding: 0 !important;
  border: 1px solid #d1d5db !important;
  border-radius: 6px !important;
  background-color: #ecfdf5 !important; 
  box-shadow: none !important;
  overflow: hidden;
  margin-top: 20px !important;
}

/* The Green Header Strip inside the box */
.status-none .page-status .status.font-large,
.status-none .status.font-large {
  background-color: #ecfdf5 !important;
  border-bottom: 1px solid #d1fae5 !important;
  display: block !important; 
  margin: 0 !important;
  border-top: 0 none !important;
   
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;

  width: 100% !important;
  box-sizing: border-box !important;
  font-size: 0 !important; /* Hide original text */
  text-align: left !important;
  line-height: 1 !important;
  color: transparent !important;
}

/* The "We're fully operational" Replacement Text & Icon */
.status-none .page-status .status.font-large::before,
.status-none .status.font-large::before {
  content: "We’re fully operational";
  font-family: "PostGrotesk", sans-serif !important;
  font-size: 19px !important;
  font-weight: 500 !important;
  color: #047857 !important;
  line-height: 1.5;
   
  /* SVG Checkmark Icon */
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 0C3.589 0 0 3.589 0 8C0 12.411 3.589 16 8 16C12.411 16 16 12.411 16 8C16 3.589 12.411 0 8 0ZM11.947 5.641C10.088 7.023 8.512 8.931 7.264 11.31C7.135 11.557 6.879 11.712 6.6 11.712C6.323 11.715 6.062 11.555 5.933 11.305C5.358 10.188 4.715 9.28 3.968 8.529C3.676 8.236 3.677 7.76 3.971 7.468C4.263 7.176 4.739 7.176 5.032 7.471C5.605 8.047 6.122 8.699 6.595 9.443C7.834 7.398 9.329 5.717 11.053 4.436C11.385 4.19 11.855 4.258 12.102 4.591C12.349 4.923 12.28 5.394 11.947 5.641Z' fill='%2310a37f'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 16px 16px;
   
  display: block;
  padding-left: 26px;
}

/* The White Description Body Text */
.status-none .page-status::after,
.page-status.status-none::after {
  content: "We’re not aware of any issues affecting our systems. We’ll update this page and email subscribers if anything changes.";
  display: block;
  padding: 16px 24px !important;
  background-color: #ffffff !important; 
   
  font-family: "PostGrotesk", sans-serif !important;
  font-size: 16px !important;
  color: #374151 !important;
  line-height: 1.5;
}

/* Hide the Timestamp */
.status-none .page-status .last-updated-stamp,
.status-none .last-updated-stamp {
  display: none !important;
}

body > div.layout-content.status.status-index.premium > div.masthead-container.premium > div > div.text-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* updates title */
body > div.layout-content.status.status-index.premium > div.container > div.unresolved-incidents > div.unresolved-incident.impact-critical > div.incident-title.font-large > a.whitespace-pre-wrap.actual-title.with-ellipsis {
  font-family: "Honey Regular", serif !important;
}

/* updates body content*/
body > div.layout-content.status.status-index.premium > div.container > div.unresolved-incidents > div.unresolved-incident.impact-critical > div.updates.font-regular {
  font-family: "PostGrotesk", sans-serif !important;
}

/* =========================================
   6. Cleanup (Hide Unwanted Sections)
   ========================================= */
.components-section {
 display: none !important; 
}

.incidents-list {
 display: none !important; 
}

/* =========================================
   7. Custom Footer / Hotline Replacement
   ========================================= */

/* 1. Hide the existing "Powered by Atlassian" text */
.page-footer span,
.page-footer a {
  display: none !important;
}

/* 2. Footer Container: Spacing + Divider Line */
.layout-content.status .container .page-footer {
  border-top: 1px solid #E5E7EB !important;
  margin-top: 48px !important;
  padding-top: 48px !important;
  padding-bottom: 60px !important;
   
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 3. Ensure the old text is gone */
.layout-content.status .container .page-footer::before {
  content: none !important;
  display: none !important;
}

/* 4. The Hotline Box */
.layout-content.status .container .page-footer::after {
  /* Content with Uppercase Headers for Emphasis */
  content: "If you're experiencing emotional distress, the resources below provide free and\A confidential support 24/7. If this is an emergency, call 911.\A\A SUICIDE PREVENTION LIFELINE\A Call 1-800-273-8255\A\A CRISIS TEXT LINE\A Text HOME to 741741";
   
  white-space: pre-wrap !important;
  display: block !important;
   
  /* Dimensions */
  width: 100% !important;
  box-sizing: border-box !important;
   
  /* Visual Styling - Clean White Box */
  background-color: #ffffff !important;
  border: 1px solid #d1d5db !important;
  border-radius: 6px !important;
   
  /* Typography */
  font-family: "PostGrotesk", sans-serif !important;
  
  /* UPDATED: Changed from 14px to 15px */
  font-size: 15px !important;
  
  font-weight: 400 !important;
  -webkit-font-smoothing: antialiased !important;
   
  line-height: 1.5 !important;
  color: #374151 !important;
  text-align: center !important;
  padding: 32px 24px !important;
   
  /* Optional Shadow */
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}