@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: "woodmart-font";
	src: url("//utiliko.io/small-business-management-software/wp-content/themes/woodmart/fonts/woodmart-font-1-400.woff2?v=8.3.4") format("woff2");
}

:root {
	--wd-text-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: #767676;
	--wd-text-font-size: 14px;
	--wd-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 600;
	--wd-title-color: #242424;
	--wd-entities-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: #333333;
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 600;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 700;
	--wd-header-el-transform: uppercase;
	--wd-header-el-font-size: 13px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(43,95,241);
	--wd-alternative-color: rgb(255,255,255);
	--btn-default-bgcolor: #f7f7f7;
	--btn-default-bgcolor-hover: #efefef;
	--btn-accented-bgcolor: #83b735;
	--btn-accented-bgcolor-hover: #74a32f;
	--wd-form-brd-width: 2px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: #333333;
	--wd-link-color-hover: #242424;
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: #111111;
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: #ffffff;
	background-image: none;
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
:root{
--wd-container-w: 1222px;
--wd-form-brd-radius: 0px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 0px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-default-box-shadow-active: none;
--btn-default-bottom: 0px;
--btn-accented-bottom-active: -1px;
--btn-accented-brd-radius: 0px;
--btn-accented-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .15);
--btn-accented-box-shadow-hover: inset 0 -2px 0 rgba(0, 0, 0, .15);
--wd-brd-radius: 0px;
}

@media (min-width: 1222px) {
[data-vc-full-width]:not([data-vc-stretch-content]),
:is(.vc_section, .vc_row).wd-section-stretch {
padding-left: calc((100vw - 1222px - var(--wd-sticky-nav-w) - var(--wd-scroll-w)) / 2);
padding-right: calc((100vw - 1222px - var(--wd-sticky-nav-w) - var(--wd-scroll-w)) / 2);
}
}


.wd-page-title {
background-color: #0a0a0a;
}

.carousel {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: transparent; /* or any background you want */
  padding: 10px 0;
}

.carousel-track {
  display: flex;
  animation: slide-right 20s linear infinite;
}

.carousel img {
  width: 150px;
  margin: 0 20px;
  border-radius: 10px;
}

/* Right-to-left animation */
@keyframes slide-right {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ===== Perfect fade-out with no visible border ===== */
.carousel::before,
.carousel::after {
  content: "";
  position: absolute;
  top: 0;
  width: 120px; /* fade size */
  height: 100%;
  z-index: 5;
  pointer-events: none;
}

/* Left fade */
.carousel::before {
  left: 0;
  background: linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));
}

/* Right fade */
.carousel::after {
  right: 0;
  background: linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
}
/* --------------------------cor--------------------------- */
  /* ---- full width wrapper ---- */
  .carousel-wrap {
    width:100%;                 /* full width */
    display:flex;
    flex-direction:column;
    gap:8px;                    /* row spacing */
    box-sizing:border-box;
  }

  /* Each row: the visible viewport */
  .chip-carousel {
    width:100%;
    overflow:hidden;
    position:relative;
    box-sizing:border-box;
    padding:6px 20px;          /* controls how much breathing space left/right; reduce to 0 for strict edge-to-edge */
    background:transparent;
  }

  /* Optional fade edges (looks nice on light bg) */
  .chip-carousel::before,
  .chip-carousel::after{
    content:"";
    position:absolute;
    top:0;
    height:100%;
    width:90px;
    pointer-events:none;
    z-index:5;
  }
  .chip-carousel::before{ left:0; background: linear-gradient(to right, var(--bg) 0%, rgba(246,248,251,0) 100%); }
  .chip-carousel::after { right:0; background: linear-gradient(to left, var(--bg) 0%, rgba(246,248,251,0) 100%); }

  /* ---- KEY IDEA: viewport contains the animated track ----
     .viewport is full-width and hides overflow; .track is 200% and animates.
  */
  .viewport{ width:100%; overflow:hidden; box-sizing:border-box; }

  /* the animated track: TWO sequences (A + A) inside */
  .chip-track{
    display:flex;
    align-items:center;
    width:200%;                /* critical: track = 2× visible */
    box-sizing:border-box;
    transform: translateX(0);
  }

  /* inside track we group the single sequence so we can center the visible sequence */
  .sequence{
    display:flex;
    align-items:center;
    gap:12px;
    /* do not set width:100% here; let content be intrinsic (max-content) so centering works */
    margin:0 auto;             /* CENTER the sequence inside the visible area */
    padding:4px 0;
  }

  /* chip style (edge-to-edge look: remove per-item margins) */
  .chip {
/*     display:inline-flex; */
    align-items:center;
/*     gap:12px; */
    padding:10px 18px;
    border-radius:999px;
    background:#f3f7fb;
    box-shadow:0 1px 0 rgba(16,24,40,0.02);
    flex:0 0 auto;            /* IMPORTANT: don't shrink */
    margin:0;                 /* no extra margins so chips feel edge-to-edge */
    min-width:140px;
  }

  .chip.small{ min-width:110px; padding:8px 12px; gap:8px; }

  .logo {
    width: 109.4px;
    height: 40px;
    flex: 0 0 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
/*     background: #fff; */
    overflow: hidden;
}
/*   .logo img{ width:22px; height:22px; object-fit:contain; display:block; }
 */
  .name{ font-weight:600; font-size:14px; color:#0f172a; white-space:nowrap; }

  /* ---- animation classes applied to .chip-track ---- */
  .marquee-left { animation: move-left linear infinite; }
  .marquee-right{ animation: move-right linear infinite; }

  /* move exactly half the track (i.e. one sequence) */
  @keyframes move-left { from{transform:translateX(0)} to{transform:translateX(-50%)} }
  @keyframes move-right{ from{transform:translateX(-50%)} to{transform:translateX(0)} }

  /* pause on hover */
  .chip-carousel:hover .chip-track { animation-play-state: paused; }

  /* speeds for each row are set inline via style="animation-duration:XXs" */

  /* accessibility */
  @media (prefers-reduced-motion: reduce){ .chip-track{ animation:none !important; transform:none !important; } }

  /* responsive */
  @media (max-width:900px){
    .chip{ min-width:110px; padding:8px 12px; }
    .logo{ width:28px; height:28px; flex:0 0 28px; }
    .logo img{ width:18px; height:18px; }
    .chip-carousel::before,.chip-carousel::after{ width:56px; }
    .chip-carousel{ padding:6px 12px; }
  }

/* ------------------------table--------------------- */
/* Entire table rounded */
img.logo {
    background-color: #ffffff00 !important;
}
table.comparison-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    text-align: center;
    border-radius: 15px;
    overflow: hidden;
    border: 1px solid #e5e5e5;
}

table.comparison-table th,
table.comparison-table td {
    padding: 18px;
    border: 1px solid #eaeaea;
    font-size: 16px;
	    text-align: center;
}

/* Feature column */
table.comparison-table th:first-child,
table.comparison-table td:first-child {
    text-align: left;
    font-weight: bold;
    background: #f7f9fc;
}

/* Header default */
th {
    background: #F0F4FF;
    font-size: 18px;
}

/* ---------- PRIMARY COLUMN FULL HIGHLIGHT ---------- */
.primary-col {
    background: #f4f7ff;
    box-shadow: 0 0 14px rgba(0, 102, 255, 0.18);
    border-left: 2px solid #3fbebc !important;
    border-right: 2px solid #3fbebc !important;
}

/* Keep header border + rounded top */
th.primary-col {
    border-top: 2px solid #2493EF !important;
    border-radius: 15px 15px 0 0;
    background-color: #2493EF;
}

/* Remove internal row borders */
td.primary-col {
    border-top: none !important;
    border-bottom: none !important;
}

/* Bottom rounding for last row */
tr:last-child td.primary-col {
    border-bottom: 2px solid #2493EF !important;
    border-radius: 0 0 15px 15px;
}

/* Icons */
.check {
    color: #fff;
    font-size: 26px;
    font-weight: bold;
}

.cross {
    color: red;
    font-size: 26px;
    font-weight: bold;
}
td.primary-col.check {
    background-color: #2493EF;
}

img.logo {
    height: 40px;
    object-fit: contain;
    width: 100%;
}
/* --------------------------------------cf7---------------- */
/* Popup style for error message */
/* Popup style */
.fr .forminator-error-message {
  position: fixed;
  bottom: 100px;
  right: 290px;
    background: #ff0000 !important;
    color: #ffffff !important;
  padding: 15px 20px;
  border-radius: 6px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
  z-index: 9999;
  opacity: 0;              /* Start hidden */
  pointer-events: none;
  transition: opacity 0.5s ease;
	    width: 20%;
}


.fr .forminator-error-message.show {
  opacity: 1;
  pointer-events: auto;
}

.fr .forminator-error-message.hide {
  opacity: 0;
  pointer-events: none;
}
/* ------------------------------------------------- */
.vc_row.wpb_row.vc_row-fluid.foot_btn {
    left: 3.5% !important;
    width: 100% !important;
    height: 140px !important;
    flex-direction: column !important;
    padding-bottom: 20px;
    padding-left: 5px;
    padding-right: 5px;

    position: fixed;
    bottom: -200px; 
    opacity: 0;
    transition: all 0.6s ease;
}

.vc_row.wpb_row.vc_row-fluid.foot_btn.show {
    bottom: 0;
    opacity: 1;
}

/* ------------------------------------------------------------------------- */
@media screen and (max-width:767px) {
.chip-track.marquee-left {
    animation-duration: 10s !important;
}
.chip-track .marquee-right {
    animation-duration: 10s !important;
}
	.carousel-track {
    display: flex;
    animation: slide-right 5s linear infinite !important;
}
}