/* Neo-Mars — custom.css (selectors from homepage 2.7 markup) */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

:root {
  --mars: 194, 84, 45;        /* rouille */
  --night: 56, 89, 140;       /* bleu nuit */
  --hair: rgba(255, 255, 255, 0.07);
}

html, body, #__next {
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif !important;
  font-feature-settings: "tnum" 1, "cv11" 1;
}

/* ---------- Fond : halos + grain */
body, #page_wrapper {
  background:
    radial-gradient(1100px 620px at 88% -12%, rgba(var(--mars), .26), transparent 62%),
    radial-gradient(700px 420px at 55% 6%,   rgba(var(--mars), .08), transparent 70%),
    radial-gradient(950px 560px at -12% 112%, rgba(var(--night), .22), transparent 62%),
    linear-gradient(180deg, #0e1117 0%, #0b0d12 100%) !important;
  background-attachment: fixed !important;
}
body::before {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none; z-index: 0;
  opacity: .045;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
#page_wrapper > * { position: relative; z-index: 1; }

/* ---------- Bandeau */
#information-widgets .widget-container,
#information-widgets-right .widget-container {
  border-radius: 14px !important;
  border: 1px solid var(--hair);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.information-widget-greeting span { font-weight: 700; letter-spacing: -.01em; }

/* ---------- Onglets : contrôle segmenté */
#myTab {
  max-width: 640px;
  margin-left: auto !important; margin-right: auto !important;
  padding: 4px !important;
  border-radius: 999px !important;
  border: 1px solid var(--hair);
  background: rgba(255,255,255,.03) !important;
}
#myTab [role="tab"] {
  border-radius: 999px !important;
  font-weight: 500; letter-spacing: .02em;
  transition: background .2s ease, color .2s ease;
}
#myTab [role="tab"][aria-selected="true"] {
  background: rgba(var(--mars), .22) !important;
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(var(--mars), .55);
}

/* ---------- Titres de groupes */
.service-group-name, .bookmark-group-name {
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .74rem !important;
  font-weight: 600 !important;
  opacity: .8;
}
.services-group > div:first-child, .bookmark-group > div:first-child {
  position: relative;
}
.services-group > div:first-child::after, .bookmark-group > div:first-child::after {
  content: ""; flex: 1; height: 1px; margin-left: .75rem; align-self: center;
  background: linear-gradient(90deg, rgba(var(--mars), .45), transparent);
}
.service-group-icon, .bookmark-group-icon { color: rgb(var(--mars)) !important; }

/* ---------- Cartes */
.service-card {
  border-radius: 14px !important;
  border: 1px solid var(--hair);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 1px 2px rgba(0,0,0,.25);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.service-card:hover {
  transform: translateY(-2px);
  border-color: rgba(var(--mars), .5);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 10px 28px rgba(0,0,0,.4);
}
.service-name { font-weight: 600; }
.service-description { opacity: .65; }

.service-block {
  border-radius: 10px !important;
  background: rgba(0,0,0,.22) !important;
  border: 1px solid rgba(255,255,255,.04);
}
.service-block-value { font-weight: 600; }
.service-block-label { text-transform: uppercase; letter-spacing: .08em; font-size: .62rem !important; opacity: .7; }

/* ---------- Pastilles de statut */
.docker-status-running > div, .site-monitor-status > div { box-shadow: 0 0 6px 1px rgba(34,197,94,.55); }
[class*="docker-status-exited"] > div, [class*="docker-status-not-found"] > div,
[class*="docker-status-error"] > div { box-shadow: 0 0 6px 1px rgba(239,68,68,.55); }

/* ---------- Favoris */
.bookmark { border-radius: 12px !important; overflow: hidden; }
.bookmark:hover { box-shadow: inset 0 0 0 1px rgba(var(--mars), .45); }

/* ---------- Divers */
.calendar-day-hover:hover { background: rgba(var(--mars), .18) !important; }
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.15) transparent; }
#footer { display: none; }
