//  =================
//      Imports
//  =================

@import '../../base/color_variables';       // Color Variables
@import '../../base/fonticons';             // Fonticons Variables
@import '../../base/urls';                  // URLS Variables
@import '../../base/utilities_variables';  // Utilities Variables

/*
    Contact 1
*/
.contact-1 {
    position: $pos-rel;
    box-shadow: $shadow-3;
    border-radius: $b-width-6;
    padding: 8px 0;
    .card-top-section {
        .dropdown.show {
            .dropdown-toggle {
                i {
                    color: $additional-color-5;
                }
            }
        }
        .dropdown {
            .dropdown-toggle {
                i {
                    &:hover {
                        color: $additional-color-5;
                    }
                }
            }
            .dropdown-menu {
                min-width: 10rem;
                border-radius: $b-width-6;
                a {
                    font-size: 12px;
                    color: $additional-color-11;
                    display: block;
                    font-weight: 600;
                    .dropdown-item.active {
                        color: $additional-color-5;
                        background-color: $color_none;
                    }
                }
                a.dropdown-item {
                    &:active {
                        color: $additional-color-5;
                        background-color: $color_none;
                    }
                    &:hover {
                        color: $additional-color-5;
                        background-color: $color_none;
                    }
                }
            }
        }
    }
    .card-mid-section {
        border-bottom: $b-width-1 $solid $light-gray;
        .usr-profile {
            position: $pos-rel;
            width: 90px;
            height: 90px;
            .badge {
                position: $pos-abs;
                height: 20px;
                width: 20px;
                border-radius: 50%;
                background-image: $additional-gradient-color-62;
                bottom: 7px;
                right: 8px;
            }
            img {
                width: 100%;
                height: 100%;
                box-shadow: $shadow-3;
            }
        }
        .team-content {
            h4 {
                color: $color_318;
                font-weight: 600;
                font-size: 20px;
            }
            span {
                font-size: 10px;
                text-transform: $transform-upper;
                color: $additional-color-6;
            }
            p {
                color: $color_2;
                font-size: 12px;
            }
            button.btn {
                font-size: 12px;
                padding: 5px 12px;
            }
        }
    }
    .card-bottom-section {
        .social-media {
            ul {
                li {
                    i {
                        padding: 12px;
                        border-radius: 50%;
                        font-size: 19px;
                        color: $white;
                        letter-spacing: 0;
                    }
                    i.icon-behance {
                        background-image: $additional-gradient-color-63;
                    }
                    i.icon-dribbble {
                        background-image: $additional-gradient-color-62;
                    }
                    i.icon-facebook {
                        background-image: $additional-gradient-color-39;
                    }
                    .social-counts {
                        h6 {
                            color: $additional-color-11;
                            font-weight: 600;
                        }
                        p {
                            font-size: 11px;
                            color: $additional-color-6;
                        }
                    }
                }
            }
        }
    }
}

/*
    Contact 2
*/
.contact-2 {
    position: $pos-rel;
    box-shadow: $shadow-3;
    border-radius: $b-width-6;
    padding: 8px 0;
    .card-top-section {
        .dropdown.show {
            .dropdown-toggle {
                i {
                    color: $additional-color-5;
                }
            }
        }
        .dropdown {
            .dropdown-toggle {
                i {
                    &:hover {
                        color: $additional-color-5;
                    }
                }
            }
            .dropdown-menu {
                min-width: 10rem;
                border-radius: $b-width-6;
                a {
                    font-size: 12px;
                    color: $additional-color-11;
                    display: block;
                    font-weight: 600;
                    .dropdown-item.active {
                        color: $additional-color-5;
                        background-color: $color_none;
                    }
                }
                a.dropdown-item {
                    &:active {
                        color: $additional-color-5;
                        background-color: $color_none;
                    }
                    &:hover {
                        color: $additional-color-5;
                        background-color: $color_none;
                    }
                }
            }
        }
    }
    .card-mid-section {
        .usr-profile {
            position: $pos-rel;
            width: 90px;
            height: 90px;
            img {
                width: 100%;
                height: 100%;
                box-shadow: $shadow-3;
            }
        }
        .team-content {
            h4 {
                color: $color_318;
                font-weight: 600;
                font-size: 20px;
            }
            span {
                font-size: 10px;
                text-transform: $transform-upper;
                color: $additional-color-6;
            }
            p {
                color: $color_2;
                font-size: 14px;
            }
        }
    }
}