/* CKC Buttons Widget - Base */
.ckc-button-wrapper {
  display: inline-block;
}

.elementor-align-center .ckc-button-wrapper {
  display: block;
  text-align: center;
}

.elementor-align-right .ckc-button-wrapper {
  display: block;
  text-align: right;
}

.elementor-align-left .ckc-button-wrapper {
  display: block;
  text-align: left;
}

.ckc-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.2;
  padding: 18px 36px;
  border-radius: 999px;
  transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.ckc-button-content-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.ckc-button-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ckc-button-icon i,
.ckc-button-icon svg {
  width: 1em;
  height: 1em;
}

/* Style One - Outlined (transparent bg, dark blue border & text) */
.ckc-button-style-one .ckc-button {
  background-color: transparent;
  color: #0d3f60;
  border: 2px solid #0d3f60;
}

.ckc-button-style-one .ckc-button .ckc-button-icon,
.ckc-button-style-one .ckc-button .ckc-button-icon i,
.ckc-button-style-one .ckc-button .ckc-button-icon svg {
  color: #0d3f60;
  fill: #0d3f60;
}

.ckc-button-style-one .ckc-button:hover {
  background-color: #01B0D7;
  color: #ffffff;
  border-color: #01B0D7;
}

.ckc-button-style-one .ckc-button:hover .ckc-button-icon,
.ckc-button-style-one .ckc-button:hover .ckc-button-icon i,
.ckc-button-style-one .ckc-button:hover .ckc-button-icon svg {
  color: #ffffff;
  fill: #ffffff;
}

/* Style Two - Filled (beige bg, white text & icon) */
.ckc-button-style-two .ckc-button {
  background-color: #d8c2b3;
  color: #ffffff;
  border: 2px solid transparent;
}

.ckc-button-style-two .ckc-button .ckc-button-icon,
.ckc-button-style-two .ckc-button .ckc-button-icon i,
.ckc-button-style-two .ckc-button .ckc-button-icon svg {
  color: #ffffff;
  fill: #ffffff;
}

.ckc-button-style-two .ckc-button:hover {
  background-color: #c9b5a5;
  color: #ffffff;
}

.ckc-button-style-two .ckc-button:hover .ckc-button-icon,
.ckc-button-style-two .ckc-button:hover .ckc-button-icon i,
.ckc-button-style-two .ckc-button:hover .ckc-button-icon svg {
  color: #ffffff;
  fill: #ffffff;
}

/* Style Three - Filled (#DAB49D bg, #01B0D7 hover) */
.ckc-button-style-three .ckc-button {
  background-color: #DAB49D;
  color: #ffffff;
  border: 2px solid transparent;
}

.ckc-button-style-three .ckc-button .ckc-button-icon,
.ckc-button-style-three .ckc-button .ckc-button-icon i,
.ckc-button-style-three .ckc-button .ckc-button-icon svg {
  color: #ffffff;
  fill: #ffffff;
}

.ckc-button-style-three .ckc-button:hover {
  background-color: #01B0D7;
  color: #ffffff;
}

.ckc-button-style-three .ckc-button:hover .ckc-button-icon,
.ckc-button-style-three .ckc-button:hover .ckc-button-icon i,
.ckc-button-style-three .ckc-button:hover .ckc-button-icon svg {
  color: #ffffff;
  fill: #ffffff;
}

/* Icon position - when right, icon gets order 2 so it appears after text */
.ckc-button-icon-right {
  order: 2;
}
