/* Remove background and padding from the list container */
.cbs-package-service-list {
  background: transparent !important;  /* force transparent */
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;  /* remove any inherited border */
}

/* Style each item individually with its own border */
.cbs-package-service-list li {
  background: transparent !important;  /* force transparent */
  border: 1px solid #ddd;              /* individual border */
  padding: 8px 10px;                    /* spacing inside border */
  margin-bottom: 10px;                  /* spacing between items and bottom */
  border-radius: 5px;                   /* optional rounded edges */
  list-style: none;                      /* remove bullets */
}

/* Optional hover effect */
.cbs-package-service-list li:hover {
  border-color: #199CDB;
}

/* Add a tiny bottom padding to the entire list so last item doesn't touch button */
.cbs-package-service-list {
  padding-bottom: 10px; /* adjust as needed */
}

/* ===== TOGGLE "INCLUDES..." STYLING ===== */
.toggle-includes {
  font-style: italic;                  /* Ensure the text stays italic */
  color: #199CDB;                      /* Theme blue color */
  cursor: pointer;
  text-decoration: underline;          /* Add underline */
  font-weight: normal;
  margin-top: 10px;
  padding-bottom: 6px;                 /* Add padding below to give space for dropdown */
}

/* Hover effect for "Includes..." */
.toggle-includes:hover {
  color: #147bb1;                      /* Darker blue on hover */
}


/* Add padding to the bottom of the last package to avoid it touching the 'Book Now' button */
.cbs-package-list li:last-child {
  margin-bottom: 20px; /* Adjust the value as needed */
}


/* ===== PACKAGE CONTAINER GRID LAYOUT ONLY ===== */
.cbs-package-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 on top row by default */
  gap: 20px; /* spacing between packages */
  padding: 10px;
}

/* Adjust bottom row for remaining packages automatically */
.cbs-package-list li {
  /* keep all existing inner content styling intact */
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .cbs-package-list {
    grid-template-columns: repeat(2, 1fr); /* 2 per row on tablets */
  }
}

@media (max-width: 768px) {
  .cbs-package-list {
    grid-template-columns: 1fr; /* stack 1 per row on mobile */
  }
}


/* ==== CONTACT FORM 7 - Equal Column Heights ==== */
.vc_row {
    display: flex;
    flex-wrap: wrap;
}
.vc_column {
    display: flex;
    flex-direction: column;
}


/* ==== CONTACT FORM 7 - Character Counter Styling ==== */
#char-count {
    text-align: right;
    font-size: 12px;
    color: #555;
    margin-top: 5px;
}

/* Optional: Style file upload fields for consistency */
.theme-form-field input[type="file"] {
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
}


/* Make all package boxes equal height */
.cbs-package-list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px; /* keep spacing between them */
}

.cbs-package-list > li {
  flex: 1 1 calc(25% - 20px); /* 4 per row on desktop */
  display: flex;
  flex-direction: column; /* ensures contents stack */
}

/* DISCOUNT TAG – SHOW ON ALL DEVICES */
.cbs-package-list li .cbs-discount-tag {
    display: inline-block !important; /* override any theme hidden styles */
    background-color: #ff5a5f; /* adjust per package if desired */
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 3px;
    margin-bottom: 5px;
    text-transform: uppercase;
    letter-spacing: 0.5px;

    /* Mobile-friendly tweaks */
    max-width: 100%; /* wrap text if container is narrow */
    box-sizing: border-box;
}
