/* ==============================================================================
 * HOMEPAGE DASHBOARD — SERIAL EXPERIMENTS LAIN (DUSK PURPLE EDITION)
 * Matching Hyprland, Waybar & Kitty themes for layer07.dev
 * ============================================================================== */

:root, .theme-slate, .dark, body {
    --color-50: 245 240 255;
    --color-100: 224 216 240;  /* #e0d8f0 Pale Lavender Text */
    --color-200: 199 125 255;  /* #c77dff Soft Violet */
    --color-300: 76 201 240;   /* #4cc9f0 Electric Cyan */
    --color-400: 255 117 143;  /* #ff758f Sunset Rose */
    --color-500: 157 78 221;   /* #9d4edd Twilight Amethyst */
    --color-600: 74 62 96;     /* #4a3e60 Muted Border */
    --color-700: 30 20 45;     /* #1e142d Deep Surface */
    --color-800: 20 15 30;     /* #140f1e Glass Surface */
    --color-900: 15 12 22;     /* #0f0c16 Void Base */
    --color-logo-start: 157 78 221;
    --color-logo-stop: 255 117 143;
}

body {
    background-color: #0f0c16 !important;
    color: #e0d8f0 !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "JetBrains Mono", Segoe UI, Roboto, sans-serif !important;
}

#inner_wrapper {
    background-color: rgba(15, 12, 22, 0.55) !important;
    backdrop-filter: blur(10px) brightness(65%) !important;
    -webkit-backdrop-filter: blur(10px) brightness(65%) !important;
}

#information-widgets {
    border-bottom: 2px solid transparent !important;
    border-image: linear-gradient(90deg, #9d4edd 0%, #ff758f 50%, #4cc9f0 100%) 1 !important;
    padding-bottom: 1rem !important;
    margin-bottom: 1.5rem !important;
}

.information-widget-resource {
    background-color: rgba(20, 15, 30, 0.7) !important;
    border: 1px solid rgba(157, 78, 221, 0.25) !important;
    border-radius: 10px !important;
    backdrop-filter: blur(8px) !important;
    transition: all 0.2s ease-in-out !important;
}

.information-widget-resource:hover {
    border-color: #ff758f !important;
    box-shadow: 0 0 12px rgba(157, 78, 221, 0.35) !important;
}

.service-card {
    background-color: rgba(20, 15, 30, 0.65) !important;
    border: 1px solid rgba(157, 78, 221, 0.2) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(8px) !important;
    transition: all 0.2s ease-in-out !important;
}

.service-card:hover {
    border-color: #ff758f !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 16px rgba(157, 78, 221, 0.4) !important;
}