/* Prices sheet — the developer's PDF made for a screen.
   Keeps the PDF's identity (white sheet, green header band, banded rows)
   but with softer rules, aligned figures and status chips. */

:root {
  --ps-green:      #2f7d46;  /* header band — between the PDF green and the brand green */
  --ps-green-soft: #55af47;  /* the PDF green, kept as an accent */
  --ps-band:       #f1f7ee;  /* banded row */
  --ps-hover:      #e6f1e1;
  --ps-rule:       #dbe7d5;  /* inner hairlines */
  --ps-edge:       #cadcc2;  /* outer border */
  --ps-ink:        #13241a;
  --ps-body:       #2b3a31;
  --ps-mute:       #5f7568;
  --ps-villa:      #1f5c3a;
  --ps-resv-ink:   #0d5c2b;
  --ps-resv-bg:    #e3f2e6;
  --ps-resv-ring:  #b3d9bd;
  --ps-sold-ink:   #a01919;
  --ps-sold-bg:    #fbe9e9;
  --ps-sold-ring:  #efc6c6;
  --ps-frame:      #4a4a4a;  /* the page rule */
}

/* ---- the sheet is a sheet of paper ---- */
.prices-modal__dialog { background: #fff; border-color: #0000001f; }

.prices-sheet {
  background: #fff;
  color: var(--ps-body);
  /* room for the 4 mm rule below — the sheet's own padding has to clear it */
  padding: 22px clamp(22px, 3vw, 36px) clamp(22px, 3vw, 36px);
}

/* a thin dark-grey rule 4 mm in from the edge, like a printed page border */
.prices-sheet::before {
  content: "";
  position: absolute;
  inset: 4mm;
  border: 1px solid var(--ps-frame);
  border-radius: 2px;
  pointer-events: none;
}

.prices-sheet__title { color: var(--ps-ink); }
.prices-sheet__date { color: var(--ps-mute); }
.prices-sheet__updated { color: var(--ps-green); }

.prices-modal__close {
  background: #fffffff2;
  border-color: #00000026;
  color: var(--ps-ink);
}
.prices-modal__close:hover { border-color: var(--ps-green); background: var(--ps-band); }

.noa-share-bar--prices { color: var(--ps-villa); }

/* ---- site plan, now the first thing on the sheet ---- */
.prices-sheet__map {
  margin: 4px 0 clamp(20px, 3vw, 28px);
  background: #fff;
  border: 1px solid var(--ps-edge);
  border-radius: 12px;
  overflow: hidden;
}

/* ---- villa table first, payment schedule centred under it ---- */
.prices-sheet__table-wrap:not(.prices-sheet__table-wrap--payment) { order: 1; }
.prices-sheet__table-wrap--payment { order: 2; }

.prices-sheet__table-wrap {
  border: 1px solid var(--ps-edge);
  border-radius: 12px;
  overflow: auto;
  box-shadow: 0 1px 2px #13241a0d, 0 10px 28px #13241a0a;
}

@media (min-width: 901px) {
  .prices-sheet__tables { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .prices-sheet__table-wrap:not(.prices-sheet__table-wrap--payment) {
    grid-column: auto; grid-row: auto; width: 100%;
  }
  .prices-sheet__table-wrap--payment {
    grid-column: auto; grid-row: auto; width: min(520px, 100%);
  }
}

@media (max-width: 900px) {
  /* the base sheet opens this up; keep it clipped so the rounded corners hold */
  .prices-sheet__table-wrap { overflow: hidden; border-radius: 10px; }
  /* 4 mm is ~15 px — the phone sheet's 6 px padding would put the rule on the tables */
  .prices-sheet { padding: 20px 18px 18px; }
}

/* ---- grid: hairlines instead of the PDF's black rules ---- */
.prices-table {
  color: var(--ps-body);
  font-variant-numeric: tabular-nums;   /* 342,2 and 1.215 line up */
}

.prices-table td,
.prices-table th {
  border: 0;
  border-bottom: 1px solid var(--ps-rule);
  border-right: 1px solid var(--ps-rule);
  color: inherit;
}
.prices-table td:last-child,
.prices-table th:last-child { border-right: 0; }
.prices-table tbody tr:last-child td,
.prices-table tbody tr:last-child th { border-bottom: 0; }

/* ---- header band ---- */
.prices-table thead th {
  background: var(--ps-green);
  border-right-color: #ffffff2e;
  border-bottom: 0;
  color: #fff;
  font-weight: 700;
  letter-spacing: .09em;
}
.prices-table thead .prices-table__sub {
  color: #ffffffc4;
  font-weight: 500;
  letter-spacing: .06em;
}

/* "Escritura Pública (Entrega de llaves)" — sentence case, as on the PDF */
.prices-table tbody .prices-table__sub {
  color: var(--ps-mute);
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}

/* ---- rows ---- */
.prices-table tbody th[scope="row"] {
  background: transparent;
  color: var(--ps-villa);
  font-weight: 700;
}

.prices-table tbody tr:nth-child(odd) td,
.prices-table tbody tr:nth-child(odd) th[scope="row"] { background: var(--ps-band); }
.prices-table tbody tr:nth-child(even) td,
.prices-table tbody tr:nth-child(even) th[scope="row"] { background: #fff; }

.prices-table tbody tr:hover td,
.prices-table tbody tr:hover th[scope="row"] { background: var(--ps-hover); }

/* ---- prices ---- */
.prices-table:not(.prices-table--payment) tbody td:last-child {
  color: var(--ps-ink);
  font-weight: 700;
}

/* "1.190.000 € + IVA" on one line, the tax quieter than the figure */
.prices-table__tax {
  display: inline;
  margin: 0;
  color: var(--ps-mute);
  font-weight: 600;
  letter-spacing: .02em;
}
.prices-table__tax::before { content: " "; }

/* ---- status chips ---- */
.prices-table__status {
  border-radius: 999px;
  padding: 3px 8px;
  font-weight: 700;
}
.prices-table__status--reserved {
  color: var(--ps-resv-ink);
  background: var(--ps-resv-bg);
  box-shadow: inset 0 0 0 1px var(--ps-resv-ring);
}
.prices-table__status--sold,
.prices-table__status--showhome {
  color: var(--ps-sold-ink);
  background: var(--ps-sold-bg);
  box-shadow: inset 0 0 0 1px var(--ps-sold-ring);
}

/* ---- payment schedule ---- */
.prices-table--payment tbody th[scope="row"] { color: var(--ps-body); font-weight: 400; }
.prices-table--payment tbody td { color: var(--ps-ink); font-weight: 700; }

/* ---- roomier on the desktop sheet ---- */
@media (min-width: 901px) {
  .prices-table td,
  .prices-table th { padding: 12px 14px; }
  .prices-table thead th { padding: 13px 14px; }
  .prices-table tbody th[scope="row"] { letter-spacing: .07em; }
  .prices-table__tax { font-size: .8em; }
  .prices-table__status { padding: 5px 11px; font-size: 11px; letter-spacing: .05em; }
  .prices-table--payment tbody th[scope="row"] { padding-left: 18px; }
}