/* ================================
   custom.css - Homepage v9 SAFE
   Maison Lorenzo ⚡
   ================================ */

/* ===== ROOT & VARIABLES ===== */
:root {
  /* couleurs */
  --bg-main: rgba(29, 36, 52, 0.65);
  --bg-card: #162232;
  --bg-card-light: rgba(31, 31, 35, 0.55);

  --text-header: #fdb833;
  --text-emerald: #b4e3f9;
  --text-thin: #9dedf6;
  --text-accent: #6dc3ea;

  /* espacements */
  --spacing-sm: calc(var(--spacing) * 0.5);
  --spacing-md: calc(var(--spacing) * 1);
  --spacing-lg: calc(var(--spacing) * 1.5);

  /* icônes */
  --icon-clock: url("/icons/relogio.svg");
}

/* ===== THEME OVERRIDE ===== */
:root[data-theme="dark"][data-color="slate"] {
  --bg-card: #162232;
}

/* ===== GLOBAL BACKGROUND FIX (IMPORTANT) ===== */
body,
#__next {
  background: transparent !important;
}

/* ===== TEXT UTILITIES ===== */
.text-theme-500 {
  font-size: 0.9em;
  font-weight: 400;
}

span.secondary-text.text-theme-800 {
  color: var(--text-accent);
  font-family: "JetBrains Mono", monospace;
}

.font-thin {
  font-weight: 500;
  color: var(--text-thin);
}

/* ===== CARDS ===== */
:is(.dark .dark\:bg-white\/5) {
  background-color: rgba(22, 34, 50, 0.75) !important;
  backdrop-filter: blur(12px);
  padding: 10px;
  border-radius: 8px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

:is(.dark .dark\:bg-white\/5):hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

/* ===== SERVICE ICONS ===== */
.service-icon--large img {
  width: 34px;
  height: 34px;
}

/* ===== TITLES ===== */
.service-title-strong {
  font-weight: 600;
  font-size: 1.05rem;
}

/* ===== HEADER STATS (SCOPED FIX) ===== */
header div.flex.flex-row.items-center.grow.justify-end {
  background-color: var(--bg-main);
  padding: 4px 8px;
  border-radius: 8px;
  font-family: "JetBrains Mono", monospace;
  line-height: 1.4;
}

/* ===== CLOCK ICON ===== */
header div.flex.flex-row.items-center.grow.justify-end::before {
  content: "";
  width: 18px;
  height: 18px;
  margin-right: 6px;
  background-image: var(--icon-clock);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* ===== DOCKER STATUS ===== */
.docker-status {
  display: inline-flex;
  background: rgba(37, 37, 40, 0.6);
  border-radius: 0 0 10px 10px;
}

/* ===== REMOVE UNUSED ===== */
#revalidate {
  display: none;
}