/* FULL BLACK BORDER TABLE */
.price-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--teritary-col);
}

/* INTERNAL BORDERS */
.price-table th,
.price-table td {
  padding: 14px;
  font-size: 16px;
}

/* HEADER */
.price-table th {
  font-weight: 700;
}
/* Price table section inserted between section-2 and section-3 */
.price-section {
  padding: 20px 10px;
  display: flex;
  justify-content: center;
  box-sizing: border-box;
}

.price-con {
  width: 100%;
  max-width: 980px;
  box-sizing: border-box;
  margin: 0 auto;
}

.price-con h2 {
  color: var(--teritary-col);
  margin-bottom: 12px;
  text-align: center;
  padding: 5px;
}

/* table wrapper enables horizontal scroll on small screens */
.price-table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* table styles */
.price-table th,
.price-table td {
  padding: 14px 18px;
  text-align: left;
  font-size: 15px;
  border: 1px solid var(--teritary-col);
}

.price-table th {
  font-weight: bolder;
}

/* emphasize price column */
.price-table tbody td:last-child {
  font-weight: 800;
}

.price-table th:last-child {
  width: 200px;
  text-align: center;
  padding-right: 18px;
  vertical-align: middle;
}

.price-table td:last-child {
  width: 200px;
  text-align: center;
  padding-right: 18px;
  vertical-align: middle;
}

/* Enquire button in table */
.price-enquire-btn {
  background: linear-gradient(
    90deg,
    var(--secondary-col) 0%,
    var(--teritary-col) 50%
  );
  color: var(--primary-col);
  border: none;
  padding: 8px 10px;
  border-radius: 8px;
  font-weight: 700;
  cursor: pointer;
  transition:
    transform 0.12s ease,
    box-shadow 0.12s ease;
  white-space: nowrap;
}

/* hover */
.price-enquire-btn:hover {
  transform: translateY(-2px);
}

@media (max-width: 1200px) {
  .price-section {
    padding: 24px 14px;
  }

  .price-con {
    max-width: 920px;
  }

  /* allow table to reflow instead of forcing a wide minimum */
  .price-table-wrap {
    overflow-x: visible;
  }

  .price-table {
    min-width: 0 !important;
    /* override original 520px minimum */
    table-layout: fixed;
    /* force columns to share available space */
    width: 100%;
  }

  .price-table th,
  .price-table td {
    padding: 12px 14px;
    font-size: 14px;
  }

  /* keep last column readable but not too wide */
  .price-table td:last-child,
  .price-table th:last-child {
    width: 160px;
    text-align: center;
  }
}

/* tighter sizing for medium-small screens */
@media (max-width: 900px) {
  .price-section {
    padding: 20px 12px;
  }

  .price-con {
    max-width: 820px;
  }

  .price-table {
    table-layout: fixed;
    width: 100%;
    min-width: 0 !important;
  }

  .price-table th,
  .price-table td {
    padding: 10px 12px;
    font-size: 13px;
  }

  /* reduce emphasis column width slightly so whole table fits */
  .price-table td:last-child,
  .price-table th:last-child {
    width: 140px;
    text-align: center;
  }
}

/* Phone portrait — ensure no horizontal scroll by forcing word-wrap and narrower paddings.
   If you prefer stacked card style on phones, switch display:block here (requires small HTML tweak). */
@media (max-width: 520px) {
  .price-section {
    padding: 16px 10px;
  }

  .price-con {
    max-width: 100%;
    padding: 0 6px;
  }

  .price-table-wrap {
    overflow-x: visible;
  }

  /* avoid scroll bars */
  .price-table {
    width: 100%;
    min-width: 0 !important;
    table-layout: fixed;
    /* distribute available width among columns */
  }

  .price-table thead {
    display: table-header-group;
  }

  /* keep header visible */
  .price-table th,
  .price-table td {
    padding: 8px 10px;
    font-size: 13px;
    white-space: normal;
    /* allow wrapping lines */
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  /* make last column narrower on phones and allow it to wrap */
  .price-table td:last-child,
  .price-table th:last-child {
    padding-right: 10px;
    /* reduce right padding so button has room */
    width: 120px;
    max-width: 120px;
    box-sizing: border-box;
  }

  /* make action buttons inside cells wrap if needed */
  .price-enquire-btn {
    display: block;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    font-size: x-small;
    white-space: normal;
    text-align: center;
  }

  .price-table td {
    overflow: visible;
    word-break: break-word;
  }
}

/* Very small phones: tighten fonts/paddings to avoid overflow */
@media (max-width: 375px) {
  .price-section {
    padding: 12px 8px;
  }

  .price-con {
    padding: 0 6px;
  }

  .price-table th,
  .price-table td {
    padding: 6px 8px;
    font-size: 12px;
  }

  .price-table td:last-child,
  .price-table th:last-child {
    padding-right: 8px;
    width: 100px;
    max-width: 100px;
  }

  .price-enquire-btn {
    padding: 2px px;
    font-size: x-small;
  }
}

/* Utility: ensure cells wrap rather than forcing horizontal scroll */
.price-table th,
.price-table td {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.price-table {
  table-layout: fixed; /* forces equal column widths */
  width: 100%; /* stretches full width */
}

.price-table th,
.price-table td {
  text-align: center;
  padding: 12px 8px !important;
}

table {
  width: 60% !important; /* makes table smaller */
  margin: 0 auto !important; /* centers the table */
}

/* ================================
   MOBILE FIX FOR PRICE TABLE
================================ */

@media (max-width: 768px) {
  .price-section {
    padding: 16px 10px;
  }

  .price-con {
    width: 100%;
    max-width: 100%;
    padding: 0;
  }

  .price-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .price-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
  }

  .price-table th,
  .price-table td {
    padding: 8px 6px;
    font-size: 13px;
    text-align: center;
    word-break: break-word;
    white-space: normal;
  }

  /* Reduce width of each column evenly */
  .price-table th:nth-child(1),
  .price-table td:nth-child(1) {
    width: 33%;
  }

  .price-table th:nth-child(2),
  .price-table td:nth-child(2) {
    width: 33%;
  }

  .price-table th:nth-child(3),
  .price-table td:nth-child(3) {
    width: 34%;
  }

  /* Enquire button */
  .price-enquire-btn {
    width: 100%;
    padding: 6px 8px;
    font-size: 12px;
    white-space: normal;
  }
}

/* EXTRA SMALL PHONES */
@media (max-width: 420px) {
  .price-table th,
  .price-table td {
    font-size: 12px;
    padding: 6px 4px;
  }

  .price-enquire-btn {
    font-size: 11px;
    padding: 6px;
  }
}
@media (max-width: 768px) {
  .price-table {
    width: 100% !important;
  }

  .price-table th,
  .price-table td {
    font-size: 14px;
    padding: 10px 8px;
  }
}

/* Small mobile refinement */
@media (max-width: 480px) {
  .price-table th,
  .price-table td {
    font-size: 13px;
    padding: 8px 6px;
  }
}
