/**
 * StarLogistik WPBakery Button Color
 * Color: StarLogistik Gelb (#dbbc17)
 *
 * This file provides all button style variations for the custom "starlogistik" color
 */

/* ==========================================================================
   Color Variables (for reference)
   ==========================================================================
   Base:         #dbbc17
   Hover:        #b89d13 (darken ~6%)
   Active:       #a68e11 (darken ~8%)
   Gradient:     #e4ca39 (lighten ~7%)
   Gradient-end: #dfc01e (lighten ~2%)
   3D Shadow:    #a38b11 (darken ~11%)
   Contrast:     #333333 (dark text for yellow background)
   ========================================================================== */

/* ==========================================================================
   Flat Style (Default)
   ========================================================================== */

.vc_btn3.vc_btn3-color-starlogistik,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-flat {
    color: #333333;
    background-color: #dbbc17;
}

.vc_btn3.vc_btn3-color-starlogistik:hover,
.vc_btn3.vc_btn3-color-starlogistik:focus,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-flat:hover,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-flat:focus {
    color: #333333;
    background-color: #b89d13;
}

.vc_btn3.vc_btn3-color-starlogistik:active,
.vc_btn3.vc_btn3-color-starlogistik.active,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-flat:active,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-flat.active {
    color: #333333;
    background-color: #a68e11;
}

/* ==========================================================================
   Outline Style
   ========================================================================== */

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-outline {
    color: #dbbc17;
    border-color: #dbbc17;
    background-color: transparent;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-outline:hover,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-outline:focus {
    color: #333333;
    border-color: #dbbc17;
    background-color: #dbbc17;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-outline:active,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-outline.active {
    color: #333333;
    border-color: #dbbc17;
    background-color: #dbbc17;
}

/* ==========================================================================
   3D Style
   ========================================================================== */

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d {
    color: #333333;
    background-color: #dbbc17;
    box-shadow: 0 5px 0 #a38b11;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d:hover,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d:focus {
    color: #333333;
    background-color: #dbbc17;
    top: 3px;
    box-shadow: 0 2px 0 #a38b11;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d:active,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.active {
    color: #333333;
    background-color: #dbbc17;
}

/* 3D Style - Size variations */
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-xs {
    box-shadow: 0 3px 0 #a38b11;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-xs:hover,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-xs:focus {
    top: 1px;
    box-shadow: 0 2px 0 #a38b11;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-sm {
    box-shadow: 0 4px 0 #a38b11;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-sm:hover,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-sm:focus {
    top: 2px;
    box-shadow: 0 2px 0 #a38b11;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-lg {
    box-shadow: 0 5px 0 #a38b11;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-lg:hover,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-3d.vc_btn3-size-lg:focus {
    top: 3px;
    box-shadow: 0 2px 0 #a38b11;
}

/* ==========================================================================
   Modern Style
   ========================================================================== */

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-modern {
    color: #333333;
    background-color: #dbbc17;
    border-color: #dbbc17;
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.01) 100%);
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-modern:hover,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-modern:focus {
    color: #333333;
    background-color: #b89d13;
    border-color: #b89d13;
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-modern:active,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-modern.active {
    color: #333333;
    background-color: #a68e11;
    border-color: #a68e11;
}

/* ==========================================================================
   Classic Style
   ========================================================================== */

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-classic {
    color: #333333;
    background-color: #dbbc17;
    border-color: rgba(0, 0, 0, 0.1);
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-classic:hover,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-classic:focus {
    color: #333333;
    background-color: #b89d13;
    border-color: rgba(0, 0, 0, 0.1);
}

.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-classic:active,
.vc_btn3.vc_btn3-color-starlogistik.vc_btn3-style-classic.active {
    color: #333333;
    background-color: #a68e11;
}

/* ==========================================================================
   Gradient Style Support
   ========================================================================== */

/* When starlogistik is used as gradient color 1 or 2 */
.vc_btn3.vc_btn3-style-gradient[data-vc-btn-color-gradient-1="starlogistik"],
.vc_btn3.vc_btn3-style-gradient[data-vc-btn-color-gradient-2="starlogistik"] {
    /* Gradient colors are handled inline by WPBakery, but we need the base color reference */
}

/* ==========================================================================
   Admin/Editor Color Preview (dropdown swatch)
   ========================================================================== */

.vc_colored-dropdown .vc_btn3-color-starlogistik,
.vc_btn3-colored-dropdown .starlogistik,
.wpb_vc_param_value.dropdown.vc_btn3-color-starlogistik,
[data-option="starlogistik"] {
    background-color: #dbbc17 !important;
}

/* ==========================================================================
   CTA (Call to Action) Button with StarLogistik color
   ========================================================================== */

.vc_cta3-actions .vc_btn3.vc_btn3-color-starlogistik {
    color: #333333;
    background-color: #dbbc17;
}

.vc_cta3-actions .vc_btn3.vc_btn3-color-starlogistik:hover,
.vc_cta3-actions .vc_btn3.vc_btn3-color-starlogistik:focus {
    color: #333333;
    background-color: #b89d13;
}

/* ==========================================================================
   Message Box with StarLogistik color (if applicable)
   ========================================================================== */

.vc_message_box.vc_message_box-solid.vc_color-starlogistik {
    background-color: #dbbc17;
    border-color: #dbbc17;
    color: #333333;
}

.vc_message_box.vc_message_box-outline.vc_color-starlogistik {
    border-color: #dbbc17;
    color: #dbbc17;
}

.vc_message_box.vc_message_box-solid-icon.vc_color-starlogistik .vc_message_box-icon {
    background-color: #a38b11;
}

/* ==========================================================================
   Icon Box with StarLogistik color (if applicable)
   ========================================================================== */

.vc_icon_element.vc_icon_element-outer .vc_icon_element-inner.vc_icon_element-color-starlogistik .vc_icon_element-icon {
    color: #dbbc17;
}

.vc_icon_element.vc_icon_element-outer .vc_icon_element-inner.vc_icon_element-background-color-starlogistik.vc_icon_element-style-rounded-less,
.vc_icon_element.vc_icon_element-outer .vc_icon_element-inner.vc_icon_element-background-color-starlogistik.vc_icon_element-style-rounded,
.vc_icon_element.vc_icon_element-outer .vc_icon_element-inner.vc_icon_element-background-color-starlogistik.vc_icon_element-style-boxed {
    background-color: #dbbc17;
}

.vc_icon_element.vc_icon_element-outer .vc_icon_element-inner.vc_icon_element-background-color-starlogistik.vc_icon_element-outline .vc_icon_element-icon {
    border-color: #dbbc17;
}