@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

html, body, #page_container, .font-medium, .font-normal, .font-light {
  font-family: 'Poppins', ui-sans-serif, system-ui, -apple-system, sans-serif !important;
}

body {
  background:
    radial-gradient(1200px 600px at 12% -10%, rgba(56,189,248,.22), transparent 60%),
    radial-gradient(1000px 560px at 88% 0%, rgba(168,85,247,.18), transparent 60%),
    radial-gradient(900px 500px at 50% 110%, rgba(14,165,233,.16), transparent 60%),
    linear-gradient(160deg, #070c18 0%, #0b1324 45%, #070b14 100%) !important;
  background-attachment: fixed !important;
}

/* Cabeçalho / saudação */
#information-widgets { padding-top: .5rem; }
#information-widgets .font-medium { letter-spacing: .2px; }

/* Títulos dos grupos */
h2, .text-theme-800, .dark\:text-theme-300 {
  letter-spacing: .3px !important;
  text-transform: none !important;
}

/* Cards em vidro */
.service-card, .bookmark-card,
div[class*="rounded"][class*="bg-theme-100"],
.dark\:bg-white\/5 {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 30px rgba(2,6,23,.45), inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter: blur(14px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.service-card:hover, .bookmark-card:hover {
  transform: translateY(-4px);
  border-color: rgba(56,189,248,.45) !important;
  box-shadow: 0 18px 42px rgba(2,6,23,.6), 0 0 0 1px rgba(56,189,248,.18) inset !important;
  background: rgba(255,255,255,.085) !important;
}

/* Ícones dos serviços */
.service-icon, img.object-contain {
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.45));
}

/* Nome do serviço */
.service-title, .font-medium.text-theme-700 {
  font-weight: 600 !important;
  letter-spacing: .2px !important;
}

/* Ping / status */
.service-ping, span[class*="ping"] { font-variant-numeric: tabular-nums; }

/* Widgets do topo */
#widgets-wrap .rounded, .information-widget-resources {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 14px !important;
  backdrop-filter: blur(12px) !important;
}