/*
 * VisionThinks Hilfe - Designwerte
 * Farben, Borders, Schatten und visuelle Effekte.
 * Zerlegung aus: vt-hilfe-liveconfig-emailadressen.css
 * Source SHA256: c264d8f9849f1b16046ac58c93cc690bd3d396d3e202c342b07a23135f891674
 * Owner-Scopes wurden in diesem Schritt absichtlich NICHT neutralisiert.
 */

.vt-hilfe .vt-card {
    background: rgba(10,20,45,.88);
    border: 1px solid rgba(255,255,255,.05);
    border-radius: 28px;
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 48px rgba(0,0,0,.22);
}

.vt-hilfe-nav-list .vt-hilfe-nav-item {
    background-color: rgb(10, 20, 45);
    background: #0c1d38;
    border: 1px solid rgba(90, 180, 255, 0.55);
    border-radius: 20px;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 2px 6px rgba(0, 90, 220, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.vt-hilfe-nav-list .vt-hilfe-nav-item.is-active,
.vt-hilfe-nav-list .vt-hilfe-nav-item:hover,
.vt-hilfe-nav-list .vt-hilfe-nav-item:focus-visible {
    background-color: #0868e8;
    border-color: rgb(34, 138, 232);
    color: #fff;
}

.vt-hilfe-nav-list .vt-hilfe-nav-item:focus,
.vt-hilfe-nav-list .vt-hilfe-nav-item:focus-visible,
.vt-hilfe-nav-list .vt-hilfe-nav-item:active {
    outline: none;
    box-shadow: none;
}

.vt-hilfe-nav-indicator {
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
}

.vt-hilfe-panel .vt-section-title {
    color: #fff;
}

.vt-hilfe-content-card:not(.is-enhanced)
.vt-hilfe-panel + .vt-hilfe-panel {
    border-top: 1px solid rgba(255,255,255,.08);
}

.vt-hilfe-spinner {
    border: 3px solid rgba(255,255,255,0.16);
    border-top-color: #3DA3FF;
    border-radius: 50%;
}

.vt-hilfe-data-list dt {
    color: #fff;
}


.vt-hilfe-step h3 {
    color: #fff;
}

.vt-hilfe-figure img {
    border-radius: 20px;
}

.vt-hilfe-content-card code {
    background-color: rgb(10, 20, 45);
    border: 1px solid rgb(19, 81, 137);
    border-radius: 20px;
    color: #fff;
}

#webhosting-faq2 {
    background: radial-gradient(
            ellipse at 50% 12%,
            rgba(36, 126, 230, 0.16) 0%,
            rgba(24, 84, 160, 0.10) 28%,
            rgba(15, 42, 82, 0.05) 48%,
            transparent 68%
        ),
        linear-gradient(
            180deg,
            #182b49 0%,
            #142540 34%,
            #101f38 68%,
            #0c192f 100%
        );
}

.webhosting-back {
    background: radial-gradient( ellipse at 50% 8%, rgba(40, 139, 245, 0.20) 0%, 
        rgba(26, 88, 168, 0.11) 38%, rgba(20, 62, 120, 0.05) 62%, transparent 82% ), radial-gradient( ellipse at 82% 42%, rgba(22, 105, 210, 0.08) 0%, rgba(22, 105, 210, 0.035) 36%, transparent 68% ), radial-gradient( ellipse at 45% 78%, rgba(30, 105, 205, 0.35) 0%, transparent 62% ), linear-gradient( 180deg, #182b49 0%, #142540 30%, #12233e 65%, #12233e 100% );
}


.vt-hilfe-figure::after {
    background: rgba(16, 33, 61, 0.18);
}


.webhosting-info-box,
.vt-hilfe-info {
    background: rgba(24, 75, 145, 0.34) !important;
    border: 1px solid rgba(72, 157, 255, 0.34) !important;
    border-radius: 14px;
}

.vt-hilfe-info-icon {
    color: #4fa9ff;
}

.vt-hilfe-nav-item {
    background: linear-gradient(
        180deg,
        rgba(25, 54, 91, 0.90) 0%,
        rgba(15, 37, 67, 0.88) 100%
    ) !important;
    border: 1px solid rgba(94, 169, 255, 0.22) !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
    border-radius: 20px;
    color: #fff;
    text-decoration: none;
}

.vt-hilfe-nav-item:hover,
.vt-hilfe-nav-item:focus-visible {
    background: linear-gradient(
        180deg,
        #147af0 0%,
        #0b68db 100%
    ) !important;
    border-color: rgba(116, 194, 255, 0.58) !important;
    box-shadow: 0 5px 12px rgba(0, 78, 190, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

.vt-hilfe-nav-item.is-active,
.vt-hilfe-nav-item[aria-current="true"] {
    background: linear-gradient(
        135deg,
        #0877f2 0%,
        #0868e8 55%,
        #075bd0 100%
    ) !important;
    border-color: rgba(116, 194, 255, 0.58) !important;
    box-shadow: 0 5px 12px rgba(0, 78, 190, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

.vt-hilfe-nav-item:focus-visible {
    outline: 2px solid rgba(130, 205, 255, 0.85) !important;
    outline-offset: 3px !important;
}

.vt-hilfe-content-card,
.webhosting-content-card {
    background: linear-gradient(
            145deg,
            rgba(22, 50, 86, 0.94) 0%,
            rgba(15, 37, 67, 0.90) 55%,
            rgba(13, 33, 60, 0.92) 100%
        ) !important;
    border: 1px solid rgba(94, 169, 255, 0.24) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
    border-radius: 22px !important;
}


.vt-hilfe-info {
    background: rgba(24, 75, 145, 0.34);
    border: 1px solid rgba(72, 157, 255, 0.34);
    border-radius: 14px;
}



.vt-hilfe-nav-card {
    background: #0c1a31 !important;
    border: 1px solid rgba(76, 150, 255, 0.14) !important;
    border-radius: 28px;
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
}

@media (max-width: 860px) {
    .vt-hilfe .vt-hilfe-nav-card {
        box-shadow: none;
        backdrop-filter: none;
    }

    .vt-hilfe .vt-hilfe-content-card {
        backdrop-filter: none;
    }
}

@media (min-width: 861px) {
    .vt-hilfe .vt-hilfe-nav-card {
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
    }
}

@media (min-width: 1400px) {
    .vt-hilfe .vt-hilfe-nav-card {
        box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
        backdrop-filter: blur(18px);
    }

    .vt-hilfe .vt-hilfe-content-card {
        backdrop-filter: blur(18px);
    }
}