:root {
   --gray-dark: #1F1F22;
   --z-index-fixed: 1100;
   --primary: #001D96;
   --secondary: #478fff;
   --secondary-rgb: 71, 143, 255;
   --border-radius-xxl: 32px;
}

.contact-whatsapp,
.platform-training {
   position: fixed;
   z-index: var(--z-index-fixed);
   right: 20px;
   bottom: 100px;
}

.contact-whatsapp a,
.platform-training a {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   background-color: rgba(255, 255, 255, .8);
   border-radius: var(--border-radius-xxl);
   box-shadow: 0 2px 20px rgba(168, 168, 168, 0.2);
   text-decoration: none;
   position: relative;
   transition: padding .4s ease-in-out;
}

.platform-training.has-whatsapp {
   bottom: 170px;
}

.page-template-single-course .platform-training.has-whatsapp,
.page-template-training .platform-training.has-whatsapp {
   bottom: 150px;
}

.platform-training a {
   background-color: rgba(var(--secondary-rgb), .2);
}

.contact-whatsapp .brand,
.platform-training .brand {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 50px;
   height: 50px;
}

.contact-whatsapp .brand img,
.platform-training .brand img {
   width: auto;
   display: block;
}

.contact-whatsapp .information,
.platform-training .information {
   display: flex;
   flex-wrap: nowrap;
   align-items: center;
   gap: .75rem;
   flex: 1;
   max-width: 0;
   opacity: 0;
   transform: translateX(calc(-1 * calc(1.5rem + 24px)));
   transition: max-width .4s ease-in-out,  .4s ease-in-out, opacity .4s ease-in-out;
}

.contact-whatsapp .label,
.platform-training .label {
   color: var(--gray-dark);
   font-weight: 500;
   padding-left: .75rem;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.contact-whatsapp .icon,
.platform-training .icon {
   padding-right: .75rem;
}

.contact-whatsapp a:hover .information,
.platform-training a:hover .information {
   max-width: 197px;
   transform: translateX(0);
   opacity: 1;
}
.contact-whatsapp .icon img,
.platform-training .icon img {
   width: 24px;
   height: auto;
   display: block;
}

.contact-whatsapp a {
   padding: 0;
}

.contact-whatsapp .brand {
   background-color: #25d366;
   border-radius: 50%;
}

.contact-whatsapp .brand img {
   height: 32px;
}

.platform-training .brand img {
   height: 26px;
}