/* --- CARTES TRANSPARENTES SUR LE FOND D'ÉCRAN --- */
.service-card, .widget-card, [class*="card"] {
    background-color: transparent !important;         /* 100% Transparent */
    backdrop-filter: blur(4px) !important;             /* Flou discret */
    border: 1px solid rgba(255, 255, 255, 0.30) !important; /* Contour blanc fin */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

/* Texte blanc net pour garantir la lisibilité */
.service-card .title, .widget-card .title, [class*="card"] h3 {
    font-weight: 700 !important;
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important; /* Ombre de texte */
}

/* --- STYLE SUBLIMÉ POUR LE WIDGET MÉTÉO --- */
[class*="weather"], [class*="openmeteo"] {
    background: rgba(255, 255, 255, 0.12) !important;
    backdrop-filter: blur(10px) !important;
    border-radius: 12px !important;
    padding: 6px 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
}

/* --- EFFET AU SURVOL DES CARTES --- */
.service-card:hover {
    transform: translateY(-4px);
    background-color: rgba(0, 0, 0, 0.35) !important; /* Léger voile au survol */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.6) !important;
}

/* Amélioration visuelle des barres de progression système (CPU/RAM) */
progress {
    border-radius: 8px;
    height: 8px;
}

/* 🛠️ CONFIGURATION FINALE AUTO-ADAPTATIVE POUR FOND.JPG 🛠️ */
body, #__next, main, #grid-layout {
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url('https://images.pexels.com/photos/37605910/pexels-photo-37605910.jpeg') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    min-height: 100vh !important;
    background-color: transparent !important;
}