/* ======================================
   1. CUSTOM FONTS (GT Walsheim)
======================================= */
@font-face {
    font-family: gt_walsheimblack;
    src: url(https://wero-wallet.eu/_next/static/media/gt-walsheim-black-webfont.1fc2ef24.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gt-walsheim-black-webfont.72332d55.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: gt_walsheimbold;
    src: url(https://wero-wallet.eu/_next/static/media/gt-walsheim-bold-webfont.eca7a9fe.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gt-walsheim-bold-webfont.d0038161.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: gt_walsheimlight;
    src: url(https://wero-wallet.eu/_next/static/media/gt-walsheim-light-webfont.24f139eb.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gt-walsheim-light-webfont.fbd260db.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: gt_walsheimmedium;
    src: url(https://wero-wallet.eu/_next/static/media/gt-walsheim-medium-webfont.546fe303.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gt-walsheim-medium-webfont.64fc9b58.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: gt_walsheimregular;
    src: url(https://wero-wallet.eu/_next/static/media/gt-walsheim-regular-webfont.06d7bc1a.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gt-walsheim-regular-webfont.e57b6fd8.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: gt_walsheimthin;
    src: url(https://wero-wallet.eu/_next/static/media/gt-walsheim-thin-webfont.b4d042f8.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gt-walsheim-thin-webfont.c422c153.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: gt_walsheimultra_bold;
    src: url(https://wero-wallet.eu/_next/static/media/gt-walsheim-ultra-bold-webfont.e6fab2d0.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gt-walsheim-ultra-bold-webfont.c1e4e0fe.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: gt_walsheimultra_light;
    src: url(https://wero-wallet.eu/_next/static/media/gt-walsheim-ultra-light-webfont.651b5c9b.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gt-walsheim-ultra-light-webfont.5b6361c2.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: gt_walsheim_weroblack;
    src: url(https://wero-wallet.eu/_next/static/media/gtwalsheimwero-bl-alt-webfont.bcee3285.woff2) format("woff2"), url(https://wero-wallet.eu/_next/static/media/gtwalsheimwero-bl-alt-webfont.daf9003a.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}

#CookiebotWidget {
    z-index: 1000!important;
}

body {
  font-family: gt_walsheimmedium, sans-serif;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
}

:root {
  --epi-primary: #1d3557;
  --epi-bg: #f8f9fa;
  --epi-border: #c2d1d9;
}

/* HIDE NATIVE ATLASSIAN ICONS */
.icon-indicator,
.status-icon,
.component-inner-container > svg {
  display: none !important;
}

/* Floating, Oval, Status-Colored Tabs */
.epi-sp-tabs-wrapper { margin-bottom: 32px; }
.epi-sp-tabs {
  display: flex; gap: 16px; padding-bottom: 12px; overflow-x: auto;
}
.epi-sp-tab {
  border: none; padding: 10px 24px; font-size: 1rem; 
  font-family: gt_walsheimbold, sans-serif; font-weight: normal;
  border-radius: 50px; cursor: pointer; white-space: nowrap; color: #ffffff !important; 
  box-shadow: 0 4px 8px rgba(0,0,0,0.2); transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
  background-color: #339966;
}
.epi-sp-tab:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0,0,0,0.25); }
.epi-sp-tab.active { box-shadow: inset 0 3px 6px rgba(0,0,0,0.3); transform: translateY(1px); filter: brightness(0.9); }
.epi-sp-tabpanel { display: none; animation: epiFadeIn 0.3s ease; }
@keyframes epiFadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }

.epi-sp-tab.tab-operational { background-color: #339966; } 
.epi-sp-tab.tab-degraded { background-color: #f1c40f; color: #212529 !important; } 
.epi-sp-tab.tab-partial { background-color: #e67e22; } 
.epi-sp-tab.tab-major { background-color: #e74c3c; } 
.epi-sp-tab.tab-maintenance { background-color: #3498db; } 

/* Base Components */
.component-container {
  background: #ffffff; border: 1px solid var(--epi-border); border-radius: 6px; margin-bottom: 12px !important; box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.component-inner-container { padding: 6px !important; display: flex !important; justify-content: space-between !important; align-items: center !important; }

/* Markets Grid */
.members-table-wrapper { width: 100%; overflow-x: auto; margin-top: 8px; margin-bottom: 32px; }
.members-grid { display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid var(--epi-border); min-width: 900px; }
.market-col { display: flex; flex-direction: column; border-right: 1px solid var(--epi-border); background: #ffffff; }
.market-col:last-child { border-right: none; }
.market-header { background: #2b3954; color: #ffffff; padding: 12px; font-family: gt_walsheimbold, sans-serif; font-weight: normal; font-size: 0.95rem; border-bottom: 1px solid var(--epi-border); }
.market-member-cell { padding: 12px; border-bottom: 1px solid var(--epi-border) !important; display: flex !important; justify-content: space-between !important; align-items: center !important; background: transparent !important; box-shadow: none !important; margin: 0 !important; border-radius: 0 !important; border-left: none !important; border-right: none !important; border-top: none !important; }
.market-col .market-member-cell:last-child { border-bottom: none !important; }
.market-member-cell .name { font-size: 0.85rem; font-family: gt_walsheimbold, sans-serif; font-weight: normal; color: #212529; }

/* Custom SVGs & Legend */
.component-status svg { width: 16px; height: 18px; display: block; }
.component-statuses-legend, .component-statuses-legend * { display: flex !important; visibility: visible !important; opacity: 1 !important; }
.component-statuses-legend { margin-top: 0 !important; margin-bottom: 24px !important;  justify-content: flex-start !important; gap: 10px !important; }
.component-statuses-legend .legend-item { align-items: center !important; gap: 5px !important; font-size: 0.9rem !important; color: var(--epi-primary) !important; font-family: gt_walsheimbold, sans-serif !important; font-weight: normal !important; }

/* Tooltip Fix */
.component-inner-container .name { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; overflow: visible !important; text-overflow: clip !important; white-space: normal !important; max-width: 85% !important; }
.component-inner-container .name span:not(.tooltip) { overflow: visible !important; text-overflow: clip !important; white-space: normal !important; }
.component-inner-container .name a, .component-inner-container .name .tooltip, .component-inner-container .name .component-description { position: static !important; float: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; }
.component-inner-container .component-status { flex-shrink: 0 !important; }

/* Uptime Page & Tabs */
body.status-uptime { background-color: #f1f4f6; }
.history-tabs { border-bottom: 1px solid #b8c7ce; margin-top: 30px; margin-bottom: 40px; display: flex; padding: 0; list-style: none; }
.history-tabs li { margin-bottom: -1px; }
.history-tabs li a { display: block; padding: 12px 24px; color: #5c6c7b; font-family: gt_walsheimbold, sans-serif; font-weight: normal; font-size: 1.05rem; text-decoration: none; border: 1px solid transparent; border-radius: 6px 6px 0 0; background: transparent; transition: all 0.2s ease; }
.history-tabs li.active a, .history-tabs li a:hover { background-color: #f1f4f6; color: var(--epi-primary); border-color: #b8c7ce; border-bottom-color: #f1f4f6; }

/* React Select Dropdown Styling */
.uptime-header .component-selector {
  margin-bottom: 32px !important;
  max-width: 400px;
}
.uptime-header .select-input__control {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  padding: 0 !important;
  min-height: auto !important;
}
.uptime-header .select-input__single-value {
  font-family: gt_walsheimbold, sans-serif !important;
  font-weight: normal !important;
  font-size: 1.25rem !important;
  color: var(--epi-primary) !important;
  margin: 0 !important;
  padding: 0 !important;
}
.uptime-header .select-input__indicator-separator {
  display: none !important;
}
.uptime-header .select-input__indicator {
  padding: 0 0 0 12px !important;
}
.uptime-header .select-input__indicator svg {
  width: 14px !important;
  height: 14px !important;
  fill: var(--epi-primary) !important;
}

/* Calendar Month Headers */
.uptime-calendar-month .month-title { font-family: gt_walsheimbold, sans-serif; font-weight: normal; color: var(--epi-primary); font-size: 1.15rem; margin-bottom: 12px; }

/* Hide 90-Day History Bars on Components */
.component-history,
.component-status-history,
.shared-partial.uptime-90-days-wrapper,
.uptime-90-days-wrapper {
  display: none !important;
}

.components-section .uptime-heading,
.components-list-heading .uptime-heading {
  display: none !important;
}