.ekit-share-wrapper {
   width: 100%;
   display: block;
}

.ekit-share-container {
   position: relative;
   display: inline-block;
   font-family: inherit;
}

.ekit-share-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #6e8efb, #a777e3);
    color: white;
    padding: 14px 28px;
    border-radius: 50px;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
    animation: pulse 3s infinite;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(110, 142, 251, 0.4);
    }
    70% {
        box-shadow: 0 0 0 20px rgba(110, 142, 251, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(110, 142, 251, 0);
    }
}

.ekit-share-text {
   font-size: 16px;
   font-weight: 600;
   margin-right: 12px;
}

.ekit-share-icon {
   width: 20px;
   height: 20px;
   fill: currentColor;
}

.ekit-share-tooltip {
   position: absolute;
   top: 120%;
   left: 50%;
   transform: translateX(-50%);
   background: white;
   border-radius: 12px;
   padding: 16px;
   box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
   opacity: 0;
   visibility: hidden;
   transition: all 0.3s ease;
   z-index: 1000;
}

.ekit-share-container:hover .ekit-share-tooltip {
   opacity: 1;
   visibility: visible;
}

.ekit-social-icons {
   display: flex;
   gap: 12px;
}

.ekit-social-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 48px;
   height: 48px;
   border-radius: 50%;
   background: #f5f5f5;
   transition: all 0.3s ease;
}

.ekit-social-icon svg {
   width: 24px;
   height: 24px;
   fill: #333;
   transition: fill 0.3s ease;
}

.ekit-social-icon:hover {
   transform: translateY(-2px);
}

.ekit-social-icon.facebook:hover {
   background: #1877f2;
}

.ekit-social-icon.twitter:hover {
   background: #1da1f2;
}

.ekit-social-icon.email:hover {
   background: #ea4335;
}

.ekit-social-icon:hover svg {
   fill: white;
}

/* Ripple Effect */
.ekit-share-button::before {
   content: "";
   position: absolute;
   inset: 0;
   background: rgba(255, 255, 255, 0.3);
   border-radius: inherit;
   transform: scale(0);
   opacity: 0;
}

.ekit-share-button:active::before {
   animation: ripple 0.6s linear;
}

@keyframes ripple {
   0% {
       transform: scale(0);
       opacity: 1;
   }
   100% {
       transform: scale(4);
       opacity: 0;
   }
}

/* Responsive styles */
@media (max-width: 768px) {
   .ekit-share-button {
       padding: 12px 24px;
   }
   
   .ekit-share-text {
       font-size: 14px;
   }
   
   .ekit-social-icon {
       width: 42px;
       height: 42px;
   }
   
   .ekit-social-icon svg {
       width: 21px;
       height: 21px;
   }
}

@media (max-width: 480px) {
   .ekit-share-button {
       padding: 10px 20px;
   }
   
   .ekit-share-tooltip {
       width: 220px;
   }
   
   .ekit-social-icons {
       gap: 10px;
   }
   
   .ekit-social-icon {
       width: 38px;
       height: 38px;
   }
   
   .ekit-social-icon svg {
       width: 19px;
       height: 19px;
   }
}