
/* ============================================================
   TBM ECONOMIC CALENDAR V1
   ============================================================ */

.ec-hero {
  background:
    radial-gradient(
      circle at 85% 10%,
      rgba(230, 184, 62, 0.08),
      transparent 30%
    ),
    linear-gradient(
      150deg,
      #0a1522,
      #07101a
    );

  border-bottom:
    1px solid rgba(226, 178, 58, 0.13);

  padding:
    70px 0 54px;
}


.ec-hero h1 {
  font-size:
    clamp(
      38px,
      5vw,
      64px
    );

  line-height: 1.03;

  margin:
    10px 0 16px;
}


.ec-hero p {
  color: #8d99a9;

  font-size: 16px;

  line-height: 1.7;

  max-width: 780px;
}


.ec-toolbar {
  background: #080e16;

  border-bottom:
    1px solid #172131;

  padding:
    22px 0 18px;
}


.ec-period-tabs {
  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  margin-bottom: 20px;
}


.ec-period-tabs button,
.ec-filter-row button {
  background: #0d1520;

  border:
    1px solid #243144;

  border-radius: 999px;

  color: #9ba7b7;

  cursor: pointer;

  font-size: 9px;

  font-weight: 900;

  letter-spacing: 0.06em;

  padding:
    8px 12px;

  transition:
    150ms ease;
}


.ec-period-tabs button:hover,
.ec-filter-row button:hover {
  border-color:
    rgba(231, 183, 63, 0.55);

  color: #efc760;
}


.ec-period-tabs button.active,
.ec-filter-row button.active {
  background:
    linear-gradient(
      135deg,
      #f0cf66,
      #d49a1b
    );

  border-color: #e6b744;

  color: #09111a;
}


.ec-filters {
  display: flex;

  flex-wrap: wrap;

  gap: 26px;
}


.ec-filters > div > span {
  color: #657386;

  display: block;

  font-size: 8px;

  font-weight: 900;

  letter-spacing: 0.11em;

  margin-bottom: 7px;

  text-transform: uppercase;
}


.ec-filter-row {
  display: flex;

  flex-wrap: wrap;

  gap: 7px;
}


.ec-high-filter:not(.active) {
  border-color:
    rgba(221, 0, 0, 0.5) !important;

  color:
    #ff5757 !important;
}


.ec-status-bar {
  align-items: center;

  border-top:
    1px solid #172131;

  display: flex;

  justify-content: space-between;

  margin-top: 20px;

  padding-top: 14px;
}


.ec-status-bar > div {
  align-items: center;

  display: flex;

  gap: 10px;
}


.ec-live-pill {
  background:
    rgba(67, 207, 149, 0.08);

  border:
    1px solid rgba(67, 207, 149, 0.2);

  border-radius: 999px;

  color: #62d4a4;

  font-size: 8px;

  font-weight: 950;

  letter-spacing: 0.09em;

  padding:
    5px 8px;
}


.ec-status-bar strong {
  color: #d5dde7;

  font-size: 11px;
}


.ec-updated {
  color: #647286;

  font-size: 9px;
}


.ec-content {
  background:
    linear-gradient(
      180deg,
      #08111c,
      #070c13
    );

  min-height: 650px;

  padding:
    28px 0 80px;
}


.ec-next-risk {
  align-items: center;

  background:
    linear-gradient(
      135deg,
      rgba(221, 0, 0, 0.08),
      rgba(125, 16, 16, 0.05)
    );

  border:
    1px solid rgba(255, 51, 51, 0.25);

  border-radius: 14px;

  display: flex;

  justify-content: space-between;

  margin-bottom: 18px;

  padding:
    15px 18px;
}


.ec-next-risk > div:first-child {
  display: flex;

  flex-direction: column;

  gap: 5px;
}


.ec-next-risk > div:first-child > span {
  color: #ff6767;

  font-size: 8px;

  font-weight: 950;

  letter-spacing: 0.11em;
}


.ec-next-risk > div:first-child > strong {
  color: #edf2f7;

  font-size: 14px;
}


.ec-risk-countdown {
  align-items: flex-end;

  display: flex;

  flex-direction: column;

  gap: 5px;
}


.ec-risk-countdown span {
  color: #e7ba49;

  font-size: 10px;

  font-weight: 950;
}


.ec-risk-countdown strong {
  color: #ffffff;

  font-size: 13px;
}


.ec-table-shell {
  background:
    linear-gradient(
      145deg,
      #0d1622,
      #09111b
    );

  border:
    1px solid #202d3d;

  border-radius: 15px;

  overflow: hidden;
}


.ec-table-head,
.ec-event-row {
  display: grid;

  grid-template-columns:
    100px
    90px
    90px
    minmax(260px, 1fr)
    110px
    110px
    110px;

  align-items: center;
}


.ec-table-head {
  background: #0b131e;

  border-bottom:
    1px solid #202d3d;

  color: #667488;

  font-size: 8px;

  font-weight: 950;

  letter-spacing: 0.09em;

  text-transform: uppercase;
}


.ec-table-head > div {
  padding:
    13px 14px;
}


.ec-event-row {
  border-bottom:
    1px solid #1a2635;

  min-height: 78px;

  transition:
    background 160ms ease;
}


.ec-event-row:last-child {
  border-bottom: none;
}


.ec-event-row:hover {
  background:
    rgba(231, 183, 63, 0.025);
}


.ec-event-row > div {
  padding:
    14px;
}


.ec-time {
  color: #d3d9e1;

  font-size: 11px;

  font-weight: 750;
}


.ec-time small {
  color: #667488;

  display: block;

  font-size: 8px;

  margin-top: 4px;
}


.ec-currency {
  color: #e8ba49;

  font-size: 11px;

  font-weight: 950;

  letter-spacing: 0.05em;
}


.ec-impact {
  border:
    1px solid transparent;

  border-radius: 999px;

  display: inline-block;

  font-size: 8px;

  font-weight: 950;

  letter-spacing: 0.07em;

  padding:
    5px 8px;
}


.ec-impact.high {
  background: #DD0000;

  border-color: #ff3b3b;

  color: #ffffff;

  animation:
    ecHighPulse
    1.15s
    ease-in-out
    infinite;

  box-shadow:
    0 0 9px
    rgba(221, 0, 0, 0.55);
}


@keyframes ecHighPulse {

  0%,
  100% {
    background: #DD0000;

    opacity: 1;

    transform: scale(1);
  }

  50% {
    background: #ff1010;

    opacity: 0.84;

    transform: scale(1.06);
  }

}


.ec-impact.medium {
  background:
    rgba(230, 178, 58, 0.08);

  border-color:
    rgba(230, 178, 58, 0.25);

  color: #e9be51;
}


.ec-impact.low {
  background:
    rgba(67, 207, 149, 0.08);

  border-color:
    rgba(67, 207, 149, 0.2);

  color: #62d4a4;
}


.ec-event-main a {
  color: #eef2f7;

  display: inline-block;

  font-size: 13px;

  font-weight: 800;

  line-height: 1.4;

  text-decoration: none;
}


.ec-event-main a:hover {
  color: #ebc15b;
}


.ec-event-meta {
  color: #657386;

  font-size: 8.5px;

  margin-top: 5px;
}


.ec-value {
  color: #9ba7b7;

  font-size: 11px;

  font-weight: 750;
}


.ec-value.empty {
  color: #4f5d6f;
}


.ec-actual.filled {
  color: #70d5aa;

  font-weight: 900;
}


.ec-state {
  color: #738196;

  font-size: 11px;

  padding:
    35px 20px;

  text-align: center;
}


@media (prefers-reduced-motion: reduce) {

  .ec-impact.high {
    animation: none;
  }

}


@media (max-width: 900px) {

  .ec-table-shell {
    overflow-x: auto;
  }

  .ec-table-head,
  .ec-event-row {
    min-width: 900px;
  }

}


@media (max-width: 600px) {

  .ec-hero {
    padding:
      48px 0 38px;
  }


  .ec-hero p {
    font-size: 14px;
  }


  .ec-next-risk {
    align-items: flex-start;

    flex-direction: column;

    gap: 12px;
  }


  .ec-risk-countdown {
    align-items: flex-start;
  }

}


/* TBM CALENDAR RESULT STATUS V1 */

.ec-actual-wrap {
  padding: 14px;
}

.ec-actual-wrap .ec-value {
  padding: 0;
}

.ec-result-status {
  display: inline-block;
  margin-top: 5px;
  padding: 4px 6px;
  border-radius: 999px;

  font-size: 7px;
  font-weight: 950;
  letter-spacing: .04em;
  white-space: nowrap;
}

.ec-result-status.above {
  color: #6bd6a8;
  background: rgba(64, 200, 144, .09);
  border: 1px solid rgba(64, 200, 144, .2);
}

.ec-result-status.below {
  color: #ff7777;
  background: rgba(221, 0, 0, .08);
  border: 1px solid rgba(221, 0, 0, .19);
}

.ec-result-status.inline {
  color: #e8bd52;
  background: rgba(226, 178, 58, .08);
  border: 1px solid rgba(226, 178, 58, .2);
}


/* TBM MAJOR CURRENCY FILTERS V1 */

.ec-filter-row {
  flex-wrap: wrap;
}

.ec-filter-row button {
  white-space: nowrap;
}

@media (max-width: 700px) {

  .ec-filter-row {
    gap: 6px;
  }

  .ec-filter-row button {
    min-width: 52px;
    padding-left: 9px;
    padding-right: 9px;
  }

}


/* TBM ECONOMIC CALENDAR EMPTY STATE V2 */

.ec-empty-next {
  margin-top: 9px;

  color: #7f8da0;

  font-size: 11px;
  line-height: 1.5;
}

.ec-empty-next strong {
  color: #e7b948;
  font-weight: 850;
}

/* Slightly improve table-header breathing room */

.ec-table-head,
.ec-event-row {
  column-gap: 16px;
}

.ec-table-head > *,
.ec-event-row > * {
  min-width: 0;
}

.ec-currency {
  padding-right: 8px;
}

@media (max-width: 800px) {

  .ec-table-head,
  .ec-event-row {
    column-gap: 10px;
  }

}

/* ==========================================================
   ECONOMIC CALENDAR V2 - FINAL HEADER STACK FIX
   ========================================================== */

/* Keep main navigation above page/ticker layers */
.nav {
  z-index: 1000 !important;
}

/* Market Intelligence remains below navigation */
.market-news-ticker,
.tbm-market-news-ticker,
#market-news-ticker {
  z-index: 100 !important;
}


/* Slight refinement to next-risk panel */
.ec-next-risk {
  box-shadow:
    0 14px 42px
    rgba(0,0,0,.12);
}


/* Keep table rows compact and easy to scan */
.ec-event-row {
  min-height: 72px !important;
}
