/*------------------------------------------------------------------*\
    APARTMENTS LISTING — [apartments_listing] shortcode
    Light-theme table scoped to .apt-listing (isolated from site dark theme).
    Built on Bootstrap 5.3 components with palette overrides.
    Mobile-first: base = mobile, progressively enhanced via min-width.
\*------------------------------------------------------------------*/

.apt-listing {
    --apt-bg:            #ffffff;
    --apt-border:        #D6D6D6;   /* table lines / borders */
    --apt-text:          #303030;   /* base / pill text */
    --apt-cell-text:     #B9B9B9;   /* table cell content */
    --apt-text-strong:   #303030;   /* header titles */
    --apt-text-muted:    #9E9E9E;
    --apt-header-bg:     #D6D6D6;   /* header background */
    --apt-header-line:   #BDBDBD;   /* header column separators (darker than bg) */
    --apt-row-hover:     #F7F7F7;
    --apt-accent:        var(--color-primary, #2C3D31);

    /* Dark UI per rb_table.png design: pills / "Ver mais" are near-black,
       not the green brand accent. Centralised so it's a one-line tweak. */
    --apt-ui-dark:       #1A1A1A;
    --apt-ui-dark-hover: #000000;
    --apt-ui-on-dark:    #ffffff;

    font-family: var(--font-secondary, "DM Sans", sans-serif);
    color: var(--apt-text);
}

/* ── Dark mode variant — token-driven (one block flips the whole
      table + filters). No green; the "#303030" UI inverts to light. ── */
[data-theme="dark"] .apt-listing {
    --apt-bg:            #141414;
    --apt-border:        #2E2E2D;
    --apt-text:          #FAFAFA;
    --apt-cell-text:     #C9C9C9;
    --apt-text-strong:   #FAFAFA;
    --apt-text-muted:    #9E9E9E;
    --apt-header-bg:     #1C1C1C;
    --apt-header-line:   rgba(255, 255, 255, 0.10);
    --apt-row-hover:     #1F1F1F;
    --apt-accent:        #D0D0D0;   /* neutral (no green) for hover/target tint */
    --apt-ui-dark:       #D0D0D0;   /* inverso de #303030: ver-mais / pill activo */
    --apt-ui-dark-hover: #C4C4C4;
    --apt-ui-on-dark:    #303030;
}
/* "Livre" badge uses a literal #303030 (not a token) → invert in dark. */
[data-theme="dark"] .apt-listing .apt-badge.apt-badge--available {
    background: #D0D0D0;
    color: #303030;
}

/* ── Filter pills ── */
.apt-listing .apt-filter.btn {
    --bs-btn-color: var(--apt-text);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--apt-border);
    --bs-btn-hover-color: var(--apt-ui-dark);
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: var(--apt-ui-dark);
    --bs-btn-active-color: var(--apt-ui-on-dark);
    --bs-btn-active-bg: var(--apt-ui-dark);
    --bs-btn-active-border-color: var(--apt-ui-dark);
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: 0.4rem;
    --bs-btn-font-size: 0.7rem;
    letter-spacing: 0.1em;
    border-width: 1px;
    font-weight: 500;
}

[data-theme="dark"] .apt-listing .apt-filter.btn {
    --bs-btn-color: var(--apt-ui-on-dark);
}

/* ── Table wrap: Bootstrap .table-responsive horizontal scroll on mobile ── */
.apt-listing .apt-table-wrap {
    border: 1px solid var(--apt-border);
    border-radius: 8px;
    /* NOTE: do NOT add `-webkit-overflow-scrolling: touch` here. It is deprecated
       (iOS 13+ momentum-scrolls natively) and its legacy compositing layer, with
       the `backdrop-filter` that used to be on the view buttons, triggered an iOS
       WebKit repaint bug — the whole table rendered blank/white until a repaint
       (filter change / row click). */
}

/* ── Table base (overrides Bootstrap) ── */
.apt-listing .apt-table {
    --bs-table-bg: var(--apt-bg);
    --bs-table-color: var(--apt-text);
    --bs-table-border-color: var(--apt-border);
    --bs-table-hover-bg: var(--apt-row-hover);
    --bs-table-hover-color: var(--apt-text-strong);
    font-size: 0.75rem;
}

.apt-listing .apt-table > :not(caption) > * > * {
    padding: 0.75rem 0.875rem;
    border-color: var(--apt-border);
    /* No vertical column separators — only horizontal row lines remain. */
    border-left: 0;
    border-right: 0;
    vertical-align: middle;
    white-space: nowrap;
}

/* ── Thead ── */
.apt-listing .apt-thead th {
    background: var(--apt-header-bg);
    color: var(--apt-text-strong);
    font-weight: 600;
    font-size: 0.625rem;
    letter-spacing: 0.08em;
    border-bottom-width: 1px;
    border-right: 0;   /* no vertical column separators */
    line-height: 1.35;
    vertical-align: middle;
    white-space: nowrap;
}

/* No separator after the last column (table edge). */
.apt-listing .apt-thead th:last-child {
    border-right: 0;
}

/* Status header: remove border on the right side to mimic screenshot */
.apt-listing .apt-th-status {
    border-right: 0;
}

/* Header subtitle (e.g. "(com varanda)" under "Área"). Smaller, regular
   weight, not uppercase — sits as a second line under the main label. */
.apt-listing .apt-col-sub {
    display: block;
    margin-top: 0.15em;
    font-size: 0.85em;
    font-weight: var(--font-regular);
    letter-spacing: 0.04em;
    text-transform: none;
    opacity: 0.72;
}

/* ── Rows ── */
.apt-listing .apt-row td {
    color: var(--apt-cell-text);
    background: var(--apt-bg) !important;
}

/* ── Anchor target (#apt-row-{slug}) — triggered by building-map click ── */
.apt-listing .apt-row {
    scroll-margin-top: 120px;
}
.apt-listing .apt-row > td {
    transition: background-color 0.2s ease;
}
.apt-listing .apt-row:hover > td {
    background: color-mix(in srgb, var(--apt-accent) 10%, var(--apt-bg)) !important;
    color: var(--apt-text-strong);
    cursor: pointer;
}
.apt-listing .apt-row.is-flash > td,
.apt-listing .apt-row:target > td {
    background: color-mix(in srgb, var(--apt-accent) 18%, var(--apt-bg)) !important;
    transition: background-color 0.6s ease;
}

/* ── "Planta" plan link — styled to match the "Livre" availability pill ──
   A solid dark pill with a white uppercase label, so it reads as an
   always-visible action mirroring the status column (same design + text as
   .apt-badge--available). Replaces the older soft "frosted glow" patch.
   Dark mode flips it like the "Livre" badge (light pill, dark label).
   c-secondary-button (in the markup) stays inert here — it needs a child
   .elementor-button that this link does not render. */
.apt-listing .apt-view-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 66px;
    height: 23px;
    padding: 16px 16px;
    border: 0;
    border-radius: 41px;
    background: #303030;
    color: #ffffff;
    font-family: inherit;
    font-size: 10px;
    font-weight: var(--font-medium);
    letter-spacing: 0.1em;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.2s ease, opacity 0.2s ease;
}

.apt-listing .apt-view-link:hover,
.apt-listing .apt-view-link:focus-visible {
    background: #000000;
    color: #ffffff;
    outline: none;
}

/* Disabled (no plan): muted, flat, non-interactive — keeps the pill shape. */
.apt-listing .apt-view-link.is-disabled {
    cursor: default;
    opacity: 0.45;
}

/* Dark mode — mirror the "Livre" badge inversion (light pill, dark label). */
[data-theme="dark"] .apt-listing .apt-view-link {
    background: #D0D0D0;
    color: #303030;
}
[data-theme="dark"] .apt-listing .apt-view-link:hover,
[data-theme="dark"] .apt-listing .apt-view-link:focus-visible {
    background: #C4C4C4;
    color: #303030;
}

/* ── Status cell: borderless, pill floats to the right ── */
.apt-listing .apt-status-cell {
    background: transparent !important;
    text-align: center;
    white-space: nowrap;
}

.apt-listing .apt-plan-cell {
    text-align: center;
}

/* ── Status pills ── */
.apt-listing .apt-badge {
    display: inline-block;
    padding: 0.4rem 0.9rem;
    font-size: 0.625rem;
    letter-spacing: 0.1em;
    line-height: 1;
    text-align: center;
}
/* Shared base for all status pills. Higher specificity
   (.apt-badge.apt-badge--x) so the fixed size wins over the base
   .apt-badge + the ≥1200px padding/min-width. Only the colour differs. */
.apt-listing .apt-badge.apt-badge--available,
.apt-listing .apt-badge.apt-badge--reserved,
.apt-listing .apt-badge.apt-badge--sold {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 66px;
    height: 23px;
    border-radius: 41px;
    color: #ffffff;
    font-size: 10px;
    font-weight: var(--font-medium);
}
.apt-listing .apt-badge.apt-badge--available {
    width: 66px;                /* livre — fixed, no side padding */
    padding: 16px 10px;
    background: #303030;
}
.apt-listing .apt-badge.apt-badge--reserved {
    width: auto;                /* reservado — grows with side padding */
    padding: 16px 18px;
    background: #DFBB61;
}
.apt-listing .apt-badge.apt-badge--sold {
    width: auto;                /* vendido — grows with side padding */
    padding: 16px 18px;
    background: #A49869;
}

/* ── "Ver mais" — gradual reveal button (dark pill per design) ── */
.apt-listing .apt-more-wrap {
    display: flex;
    justify-content: center;
    margin-top: 1.5rem;
}
.apt-listing .apt-more-wrap[hidden] {
    display: none;
}
.apt-listing .apt-more {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 90px;
    height: 40px;
    padding: 16px 10px;
    background: var(--apt-ui-dark);
    color: var(--apt-ui-on-dark);
    font-family: inherit;
    font-size: 10px;
    font-weight: var(--font-medium);
    letter-spacing: 0.12em;
    border-radius: 10px;
    transition: background-color 0.2s ease, opacity 0.2s ease;
}
.apt-listing .apt-more:hover,
.apt-listing .apt-more:focus-visible {
    background: var(--apt-ui-dark-hover);
    outline: none;
}
.apt-listing .apt-more:disabled {
    opacity: 0.55;
    cursor: default;
}
.apt-listing .apt-more.is-loading {
    cursor: progress;
}

/* Rows revealed gradually. GSAP animates when present; this is the
   no-GSAP / reduced-motion fallback (a soft fade as each row unhides). */
.apt-listing .apt-row--enter {
    animation: apt-row-in 0.35s ease both;
}
@keyframes apt-row-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .apt-listing .apt-row--enter { animation: none; }
}

/* ── Empty state ── */
.apt-listing .apt-empty {
    color: var(--apt-text-muted);
    font-size: 0.875rem;
}

/* GLightbox toma conta do overlay; CSS proprio vem da CDN da lib.
 * Aqui so as regras especificas a tabela (a seguir). */

/* Scroll horizontal so abaixo de xl (1200px) — Bootstrap `.table-responsive-xl`
 * aplica `overflow-x: auto` + momentum scroll automaticamente nesse range.
 * Limiar a xl (nao lg) porque com 11 colunas a tabela so cabe naturalmente
 * a partir de ~1200px (cabe no container de 1280 do design); a lg/992 o iPad
 * Pro (1024) cortava as ultimas colunas. A partir de xl, a regra desktop troca
 * cells para `white-space: normal` e a tabela cabe sem wrapper de scroll. */

/* Coluna Piso: garantir que valores como "Piso 1" / "R/CH" cabem numa linha
 * (regra desktop em :209 troca o nowrap base por white-space: normal). */
.apt-listing .apt-table [data-label="Piso"] {
    white-space: nowrap;
}

/* ── Desktop enhancements (≥ xl / 1200px) — matches `.table-responsive-xl`
      so the compact horizontal-scroll table is kept through the iPad Pro
      (1024) range and the natural full table only kicks in once it fits. ── */
@media (min-width: 1200px) {
    .apt-listing .apt-filter.btn {
        --bs-btn-padding-x: 1.25rem;
        --bs-btn-padding-y: 0.5rem;
        --bs-btn-font-size: 0.75rem;
    }

    .apt-listing .apt-table-wrap {
        border: 0;
        border-radius: 0;
    }

    .apt-listing .apt-table {
        font-size: 0.8125rem;
    }

    .apt-listing .apt-table > :not(caption) > * > * {
        padding: 1rem 1.25rem;
        white-space: normal;
    }

    .apt-listing .apt-thead th {
        font-size: 0.6875rem;
        letter-spacing: 0.12em;
        white-space: normal;
    }

    /* Planta column matches the Disponibilidade column width. */
    .apt-listing .apt-status-cell,
    .apt-listing .apt-plan-cell {
        width: 140px;
    }

    .apt-listing .apt-badge {
        padding: 0.5rem 1.5rem;
        font-size: 0.6875rem;
        letter-spacing: 0.12em;
        min-width: 96px;
    }
}