/** Shopify CDN: Minification failed

Line 102:0 Unexpected "}"

**/
/* === General Container & Font === */


#priceTableContainer {
    margin: 0 auto;    /* This centers the container horizontally */
    color: #333; /* Darker grey for better text readability */
    padding: 2rem;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    width: 100%;
    
    /* === THIS IS THE CHANGE === */
    overflow-x: auto; /* Allows horizontal scrolling if needed */
}

/* === Main Table Styling === */
#priceTable {
    border-collapse: collapse; /* Use collapse for cleaner lines */
    border-spacing: 0;
    width:100%;
    background: #fff;
    /* A softer, more modern shadow */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    border-radius: 12px;
 /* === THIS IS THE CHANGE === */
    overflow-x: auto; /* Allows horizontal scrolling if needed */
    border: 1px solid #dfe6f0; /* A light border for definition */
}

/* === Table Header === */
#priceTable thead {
    /* A more professional, darker blue-grey */
    background: #2c3e50;
    color: #fff;
}

#priceTable th {
    padding: 16px 18px; /* Added more vertical padding */
    text-align: left;
    font-weight: 600;
    /* Uppercase headers look more professional */
    text-transform: uppercase;
    font-size: 0.85em;
    letter-spacing: 0.5px;
}

/* === Table Body & Cells === */
#priceTable td {
    padding: 16px 18px; /* Match header padding for alignment */
    text-align: left;
    /* Use subtle borders instead of zebra striping for a cleaner look */
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

/* Remove border from the last row */
#priceTable tbody tr:last-child td {
    border-bottom: none;
}

/* A more subtle hover effect */
#priceTable tbody tr:hover {
    background: #f5f9ff;
}

/* === Data Alignment (Crucial for Professional Look) === */

/* Right-align all numerical/price headers */
#priceTable th:nth-child(2), /* 2.5mg */
#priceTable th:nth-child(3), /* 5mg */
#priceTable th:nth-child(4), /* 7.5mg */
#priceTable th:nth-child(5), /* 10mg */
#priceTable th:nth-child(6), /* 12.5mg */
#priceTable th:nth-child(7), /* 15mg */
#priceTable th:nth-child(8) { /* TrustPilot */

}

/* Right-align all numerical/price data */
#priceTable td:nth-child(2),
#priceTable td:nth-child(3),
#priceTable td:nth-child(4),
#priceTable td:nth-child(5),
#priceTable td:nth-child(6),
#priceTable td:nth-child(7),
#priceTable td:nth-child(8) {
    /* Use a monospaced font for numbers so they align perfectly */
    font-family: 'Menlo', 'Consolas', 'Courier New', monospace;
    font-size: 1em;
}

/* === Specific Cell Styling === */

/* TrustPilot Rating
#priceTable td:nth-child(8) {
    font-weight: 700;
    color: #00529B; /* A 'TrustPilot'-like blue */
} */
/* Optional: Add a star
#priceTable td:nth-child(8)::before {
    content: '⭐ ';
    font-size: 0.8em;
    opacity: 0.7;
    margin-right: 2px;
} */

/* Discount Type (e.g., £10 off) */
#priceTable td:nth-child(10) {
    font-size: 0.95em;
    color: #d9534f; /* A "discount" red */
    font-weight: 500;
    text-align: center;
}

/* Discount Code (e.g., MEDEAZY30) */
#priceTable td:nth-child(11) {
    font-weight: 600;
    color: #10b981; /* Keep your nice green */
    font-family: 'Courier New', monospace;
    letter-spacing: 0.5px;
    text-align: center;
}

/* "View" Link as a Button */
#priceTable td:nth-child(12) {
    text-align: center; /* Center the button */
}

#priceTable td:nth-child(12) a {
    display: inline-block;
    padding: 8px 16px;
    background-color: #3b82f6; /* A modern, friendly blue */
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    font-weight: 500;
    font-size: 0.9em;
    transition: background-color 0.2s ease;
}

#priceTable td:nth-child(12) a:hover {
    background-color: #2563eb; /* Darker on hover */
}

/* === DataTables Controls (Search, Pagination) === */

/* "Show entries" dropdown */
.dataTables_wrapper .dataTables_length label {
    font-weight: 500;
    color: #555;
    font-size: 0.95em;
}

.dataTables_wrapper .dataTables_length select {
    margin: 0 8px;
    padding: 6px 10px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background-color: #fff;
    outline: none;
}

/* Search Box */
.dataTables_wrapper .dataTables_filter {
    margin-bottom: 1.5rem; /* More space above table */
}

.dataTables_wrapper .dataTables_filter label {
    font-weight: 500;
    color: #555;
    font-size: 0.95em;
}

.dataTables_wrapper .dataTables_filter input {
    margin-left: 8px;
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    transition: all 0.2s ease-in-out;
}

/* Add a modern focus ring */
.dataTables_wrapper .dataTables_filter input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
    outline: none;
}

/* Pagination Buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 8px 14px; /* Make buttons easier to click */
    margin: 2px;
    border-radius: 6px;
    border: 1px solid #ddd;
    background: #fff;
    color: #333 !important; /* Override default */
    transition: all 0.2s ease;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #f4f4f4;
    border-color: #ccc;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: #3b82f6; /* Use the new accent blue */
    color: #fff !important;
    border-color: #3b82f6;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(59, 130, 246, 0.3);
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    opacity: 0.5;
    background: #f9f9f9;
}

/* === Your Original Discount/Button Classes === */
/* (Styling them based on the new design) */

.discount-code {
    display: none;
    font-weight: bold;
    color: #10b981;
    background: #e7f8f3;
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px dashed #10b981;
    margin-top: 5px;
}

.show-hide-btn {
    background: #f0f0f0;
    border: 1px solid #ccc;
    border-radius: 6px;
    cursor: pointer;
    padding: 4px 8px;
    font-size: 0.8em;
    color: #555;
    transition: all 0.2s ease;
}

.show-hide-btn:hover {
    background: #e0e0e0;
    border-color: #bbb;
}


/* === COLUMN FILTER DROPDOWN === */
#column-filter-container {
  /* This is key for positioning the dropdown */
  position: relative; 
  float: left; /* Aligns it to the left */
  margin-bottom: 1.5rem;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

#column-filter-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: #333;
  transition: all 0.2s ease;
}

#column-filter-btn:hover {
  background-color: #f4f4f4;
  border-color: #bbb;
}

#column-filter-btn:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

/* The little dropdown arrow */
#column-filter-btn svg {
  width: 20px;
  height: 20px;
  margin-left: 4px;
  opacity: 0.7;
}

/* The dropdown menu itself */
#column-filter-dropdown {
  /* Hidden by default */
  display: none; 
  position: absolute;
  top: 100%; /* Position it right below the button */
  left: 0;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  padding: 8px;
  margin-top: 4px; /* A small gap */
  z-index: 1000;
  min-width: 180px;
}

/* This class will be added by JS to show the menu */
#column-filter-dropdown.active {
  display: block;
}

/* Styling for the checkboxes */
#column-filter-dropdown label {
  display: block;
  padding: 8px 12px;
  font-size: 14px;
  color: #333;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

#column-filter-dropdown label:hover {
  background-color: #f5f5f5;
}

#column-filter-dropdown input[type="checkbox"] {
  margin-right: 8px;
  /* Modern-looking checkbox */
  accent-color: #3b82f6;
  width: 15px;
  height: 15px;
  vertical-align: middle;
}

/* A little divider */
.filter-divider {
  height: 1px;
  background-color: #eee;
  margin: 8px 0;
}




/* === TRUSTPILOT STAR RATING === */
.star-rating {
  /* Prevents stars from wrapping to a new line */
  white-space: nowrap; 
}

.star-rating .active {
  color: #10b981; /* Or your preferred 'TrustPilot' green */
}

.star-rating .inactive {
  color: #d1d5db; /* A light grey for the empty stars */
}

/* DataTables class to center content in a cell */
.dt-center {
  text-align: center;
}





/* === FAVOURITE ICON STYLING === */
.fav-icon {
  cursor: pointer;
  font-size: 1.2em; /* Make the star a bit bigger */
  color: #ccc; /* Default 'empty' star color */
  transition: all 0.2s ease;
}

.fav-icon.favourited {
  color: #f39c12; /* A nice 'favourited' gold color */
  transform: scale(1.1); /* Add a little pop */
}

.fav-icon:hover {
  opacity: 0.7;
}

/* === "Show Favourites" CHECKBOX STYLING === */
#fav-filter-label {
  display: inline-flex;
  align-items: center;
  margin-left: 16px;
  font-size: 14px;
  font-weight: 500;
  color: #333;
  cursor: pointer;
}

#fav-filter-label input[type="checkbox"] {
  margin-right: 6px;
  accent-color: #3b82f6;
  width: 15px;
  height: 15px;
  vertical-align: middle;
}