/* bookshop-look-inside-button.css */
#bookshop-look-inside-button-container {
    margin-top: 20px; /* Adjust as needed */
}

.bookshop-look-inside-button {
    background-color: #007bff;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.2s ease;
}

.bookshop-look-inside-button:hover {
    background-color: #b30000;
}

/* Style for the custom fields container */
.bookshop-custom-fields-container {
    margin-top: 20px; /* Add any desired spacing */
    display: flex; /* Use flexbox to create a row layout */
    flex-wrap: wrap; /* Wrap the items if they exceed the container width */
    margin-bottom: 0; /* Add this line to remove bottom margin */
}


/* Style for the custom fields row */
.bookshop-custom-fields-row {
    display: flex; /* Use flexbox to create a row layout */
    flex: 1; /* Allow the row to grow and take up the available space */
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    margin-bottom: 1.3em;
}

/* Style for each custom field column */
.bookshop-custom-field {
    flex: 1; /* Allow the columns to grow and take up equal space */
    padding: 10px; /* Add some spacing between columns */
    border-right: 1px solid #ddd; /* Add borders between columns */
}

/* Style for the last column to remove the right border */
.bookshop-custom-field:last-child {
    border-right: none;
}

.bookshop-custom-fields-table tr:last-child td,
.bookshop-custom-fields-table tr:last-child th {
    border-bottom: none;
}

/* Style for the custom field content */
.bookshop-custom-field p {
    font-size: 10px; /* Adjust the font size as needed */
    margin: 0; /* Remove any default margins */
    text-align: center;
}

/* Style for the container holding the table */
.bookshop-custom-fields-container {
    margin-top: 20px;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 0px;
    background-color: #f9f9f9;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
  
  /* Style for the table */
  .bookshop-custom-fields-table {
    width: 100%;
    border-collapse: collapse;
  }
  
  /* Style for table header cells */
  .bookshop-custom-fields-table th {
    padding: 12px 20px;
    text-align: left;
    background-color: #007BFF;
    color: #fff;
    border-bottom: 1px solid #ddd;
  }
  
  /* Style for table data cells */
  .bookshop-custom-fields-table td {
    padding: 12px 20px;
    border-bottom: 1px solid #ddd;
  }
  
  /* Style for alternate rows */
  .bookshop-custom-fields-table tr:nth-child(even) {
    background-color: #f2f2f2;
  }
  
  /* Style for table links */
  .bookshop-custom-fields-table a {
    color: #007BFF;
    text-decoration: none;
  }
  
  /* Style for table links on hover */
  .bookshop-custom-fields-table a:hover {
    text-decoration: underline;
  }

  .best-selling-badge {
    background: rgb(255, 0, 0);
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    font-size: 90%;
    font-weight: 600;
    line-height: 24px;
    margin-right: 11px;
    padding: 0 3px 0 8px;
    position: relative;
}

.best-selling-badge:after {
    background: rgb(255, 0, 0);
    -webkit-clip-path: polygon(0 0, 100% 0, 20% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 20% 100%, 0 100%);
    content: "";
    display: inline-block;
    height: 24px;
    left: 100%;
    margin-left: -2px;
    position: absolute;
    width: 15px;
}

/* Existing styles for the quote row with horizontal scroll */
.quote-row {
  display: flex;
  overflow-x: auto; /* Enable horizontal scrolling */
  margin-bottom: 20px; /* Spacing between the row and other elements */
}

.highlight-card {
  border: 1px solid #ddd; /* Border color */
  border-radius: 8px; /* Rounded corners */
  padding: 15px; /* Padding around the card */
  min-width: 250px; /* Set the minimum width for each card */
  margin-right: 20px; /* Spacing between cards */
  position: relative; /* Position relative for absolute positioning of bottom text */
}

.qhighlight-content {
  font-size: 16px; /* Font size of the quote content */
  line-height: 1.6; /* Line height for better readability */
  text-align: center;
  position: relative; /* Position relative for absolute positioning of bottom text */
}

.qhighlight-content a {
  display: block;
  color: inherit; /* Inherit the text color from the parent container */
  text-decoration: none;
  cursor: pointer;
}

.qhighlight-content a:hover {
  text-decoration: underline; /* Add underline on hover if needed */
}

/* New style for the bottom text */
.qhighlight-bottom {
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 5px;
  background-color: #f5f5f5; /* Background color for the bottom text */
  font-size: 12px; /* Font size for the bottom text */
}