/* ZapYou's look over Gatus's interface. The selectors follow Gatus's internal markup, so check the page again after every Gatus upgrade. */
/* Colors from app/globals.css in the frontend. custom.css loads before Gatus's stylesheet, so these need more specificity than its ":root" and ":root.dark". */
html:root {
  --background: 0 0% 100%; --foreground: 222.2 84% 4.9%;
  --card: 0 0% 100%; --card-foreground: 222.2 84% 4.9%;
  --popover: 0 0% 100%; --popover-foreground: 222.2 84% 4.9%;
  --primary: 238.85 34.21% 29.8%; --primary-foreground: 0 0% 100%;
  --muted: 210 40% 96%; --muted-foreground: 214.74 16.38% 44.08%;
  --accent: 212.73 33.33% 93.53%; --accent-foreground: 222.2 84% 4.9%;
  --border: 214.3 31.8% 91.4%; --input: 214.3 31.8% 91.4%;
  --destructive: 0 73.71% 41.76%; --destructive-foreground: 210 40% 98%;
}
html:root.dark {
  --background: 235.38 31.71% 8.04%; --foreground: 231.43 33.33% 95.88%;
  --card: 237 27.78% 14.12%; --card-foreground: 231.43 33.33% 95.88%;
  --popover: 237 27.78% 14.12%; --popover-foreground: 231.43 33.33% 95.88%;
  --primary: 199.62 61.9% 49.41%; --primary-foreground: 240 44.44% 10.59%;
  --muted: 234.55 26.19% 16.47%; --muted-foreground: 232.5 15.58% 69.8%;
  --accent: 236.67 32.14% 21.96%; --accent-foreground: 231.43 33.33% 95.88%;
  --border: 233.79 21.48% 26.47%; --input: 233.79 21.48% 26.47%;
  --destructive: 0 90.6% 70.78%; --destructive-foreground: 240 44.44% 10.59%;
}

/* Logo: the wordmark replaces the header's text, and only one logo can be configured, so the dark theme swaps it here. */
div:has(> img[alt="Gatus"]) { width: 132px !important; height: 32px !important; }
a:has(img[alt="Gatus"]) > div:last-child { display: none !important; }
html.dark img[alt="Gatus"] { content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjE0Mi41MiAyNTYuNyA1MDYuOTcgOTguNiIgd2lkdGg9IjUwNyIgaGVpZ2h0PSI5OSIgcm9sZT0iaW1nIj4KICA8dGl0bGU+WmFwWW91PC90aXRsZT4KICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMTkyLjM0LDI3MS44N3YxMC4yNGwtMjkuODcsMzYuMzhoMjkuODd2MTIuNTloLTQ5Ljgydi0xMC4zNWwyOS43Ni0zNi4yN2gtMjkuNzZ2LTEyLjU5SDE5Mi4zNHoiLz4KICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMjU1LjcsMjkzLjc0djM3LjM0aC0xMC4zNWwtMy4wOS01LjU1Yy0yLjk5LDQuNTktOC44NSw3Ljg5LTE5LjYzLDcuODljLTIxLjAyLDAtMjMuOS0xMi4yNy0yMy45LTE5Ljk1IGMwLTcuNjgsMi44OC0xOS44NCwyMy45LTE5Ljg0YzguNzUsMCwxNC40LDIuMDMsMTcuODEsNS4zM3YtMy42M2MwLTExLjk1LTExLjYzLTEzLjk4LTE5LjEtMTMuOThjLTYuNTEsMC0xMi41OSwxLjA3LTE3LjYsMy4zMSB2LTEyLjE2YzUuNTUtMi4wMywxNS45LTIuOTksMjEuNjYtMi45OUMyMzIuMTIsMjY5LjUyLDI1NS43LDI3MC43LDI1NS43LDI5My43NHogTTI0MC40NCwzMTMuMjZjMC01LjU1LTIuMjQtMTAuMDMtMTIuOTEtMTAuMDMgYy0xMC42NywwLTEzLjAyLDQuOC0xMy4wMiwxMC4xM2MwLDUuMzMsMi4zNSwxMC4xMywxMy4wMiwxMC4xM0MyMzguMjEsMzIzLjUsMjQwLjQ0LDMxOC44MSwyNDAuNDQsMzEzLjI2eiIvPgogIDxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0zMjYuMjEsMzAxLjUzYzAsMTcuNS01LjY1LDMxLjktMjUuNiwzMS45Yy05LjcxLDAtMTYuMTEtMy40MS0yMC4wNi04Ljk2djMwLjYySDI2NS4zdi04My4yMWgxMC42NyBsMy4yLDguNzVjMy44NC02LjcyLDEwLjQ1LTExLjA5LDIxLjQ0LTExLjA5QzMyMC41NiwyNjkuNTIsMzI2LjIxLDI4NC4wMywzMjYuMjEsMzAxLjUzeiBNMzEwLjYzLDMwMS41MyBjMC0xMS4yLTMuMi0xOS42My0xNS4wNC0xOS42M2MtMTEuNzMsMC0xNS4wNCw4LjMyLTE1LjA0LDE5LjYzYzAsMTEuMiwzLjMxLDE5LjUyLDE1LjA0LDE5LjUyIEMzMDcuNDMsMzIxLjA1LDMxMC42MywzMTIuNzMsMzEwLjYzLDMwMS41M3oiLz4KICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMzUwLjMzLDMyOS41NmwtMjAuMzctNTguNmgxNi40M2wxMy45MSw0NC4zNmwxMy45MS00NC4zNmgxNi4zMmwtMjAuMjcsNTguNiBjLTYuMTMsMTguNzMtMTMuMDMsMjUuNzQtMjUuODUsMjUuNzRjLTIuNDEsMC02LjAyLTAuMTEtOC44Ny0xLjF2LTEyLjcxYzIuNDEsMC43Nyw1LjM3LDAuODgsNy42NywwLjg4IGM2LjAyLDAsOS41My00LjcxLDEyLjM4LTEyLjgySDM1MC4zM3oiLz4KICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNNDIzLjYxLDI2OC41NGMyNC43NiwwLDMxLjg4LDE0Ljc5LDMxLjg4LDMyLjc1cy03LjEyLDMyLjg2LTMxLjg4LDMyLjg2cy0zMS45OS0xNC45LTMxLjk5LTMyLjg2IFMzOTguODYsMjY4LjU0LDQyMy42MSwyNjguNTR6IE00MjMuNjEsMjgxLjI1Yy0xMi42LDAtMTUuOTksOC40My0xNS45OSwyMC4wNWMwLDExLjUsMy40LDIwLjE2LDE1Ljk5LDIwLjE2IGMxMi43MSwwLDE1Ljk5LTguNzYsMTUuOTktMjAuMTZDNDM5LjYxLDI4OS42OCw0MzYuMjEsMjgxLjI1LDQyMy42MSwyODEuMjV6Ii8+CiAgPHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTUwNy41MiwyNzAuOTVoMTUuNjZ2NjAuNzloLTEwLjUybC0zLjUxLThjLTMuNCw2LjAyLTkuNTMsMTAuNDEtMjAuMzcsMTAuNDEgYy0yMC41OSwwLTI0LjU0LTE0LjY4LTI0LjU0LTI3LjQ5di0zNS43MWgxNS42NnYzNC44M2MwLDcuNjcsMi4wOCwxNi4yMSwxMy44LDE2LjIxczEzLjgtOC43NiwxMy44LTE2LjU0VjI3MC45NXoiLz4KICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNNTk4LjYsMjc5LjE4aC05LjYxYy0xLjcyLDAtMy4xMS0xLjM5LTMuMTEtMy4xMXYtNC4yMWMwLTEuODYtMS41MS0zLjM3LTMuMzctMy4zN2wtMjcuODItMTEuNzkgYy0xLjg2LDAtMy4zNywxLjUxLTMuMzcsMy4zN2wxLjk1LDc2LjU3YzAsMS42OSwxLjM3LDMuMDYsMy4wNiwzLjA2bDI2LjY1LTEyLjE5YzEuNjksMCwzLjA2LTEuMzcsMy4wNi0zLjA2bC0wLjA5LTcuMzcgYy0wLjA0LTMuNTksMC44LTcuMTMsMi40NS0xMC4zMWwxMi40Mi0yMy45NUM2MDEuNjcsMjgxLjE2LDYwMC40NiwyNzkuMTgsNTk4LjYsMjc5LjE4eiIvPgogIDxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik02MDMuNTksMzE2LjloOS42MWMxLjcyLDAsMy4xMSwxLjM5LDMuMTEsMy4xMXY0LjIxYzAsMS44NiwxLjUxLDMuMzcsMy4zNywzLjM3bDI2LjQ0LDEyLjEgYzEuODYsMCwzLjM3LTEuNTEsMy4zNy0zLjM3bC0xLjk1LTc0LjY4YzAtMS42OS0xLjM3LTMuMDYtMy4wNi0zLjA2bC0yNS4yNyw5Ljk5Yy0xLjY5LDAtMy4wNiwxLjM3LTMuMDYsMy4wNmwwLjEsOC4wOSBjMC4wNCwzLjExLTAuNjksNi4xOC0yLjEyLDguOTVsLTEyLjc1LDI0LjU5QzYwMC41MSwzMTQuOTIsNjAxLjcyLDMxNi45LDYwMy41OSwzMTYuOXoiLz4KPC9zdmc+Cg=="); }

/* Gatus's own marks: the footer, the GitHub link and the logo spinning while the page loads. */
footer:has(a[href="https://gatus.io"]),
a[href*="github.com/TwiN"],
img[alt="Gatus logo"] { display: none !important; }

/* Controls in English that three services don't need. The theme and refresh interval selectors stay, at the owner's request. */
div.bg-card.rounded-lg.border:has(> .flex-1 input),
button[title*="response time"],
button[title="Refresh data"] { display: none !important; }

/* "29 minutes ago" is fixed English text, so it is hidden rather than translated. */
.flex.items-center.justify-between.text-xs.text-muted-foreground.mt-1 { display: none !important; }

/* Status badges: their text is fixed in English, so it is swapped by state. */
.rounded-full.border.bg-green-500,
.rounded-full.border.bg-destructive,
.rounded-full.border.bg-yellow-500,
.rounded-full.border.bg-secondary { font-size: 0 !important; }
.rounded-full.border.bg-green-500::after { content: "Operacional"; font-size: .75rem; }
.rounded-full.border.bg-destructive::after { content: "Fora do ar"; font-size: .75rem; }
.rounded-full.border.bg-yellow-500::after { content: "Instável"; font-size: .75rem; }
.rounded-full.border.bg-secondary::after { content: "Sem dados"; font-size: .75rem; }