/* NexWAYPOINT stylesheet -- page container, alerts, data tables, badges, cards
   Part of the css/ set loaded in order by public/_head_assets.php.
   Boundaries are contiguous line ranges; keep cascade order across files. */

.container { max-width: 1200px; margin: 0 auto; padding: 1.5rem; }
.container.container-wide { max-width: min(1400px, 100%); }

.table-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-top: 0.5rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--panel);
}
.table-scroll table { margin-top: 0; }

.alert { padding: 0.6rem 1rem; border-radius: 4px; margin-bottom: 1rem; }
.alert-error {
    background: var(--alert-error-bg);
    border: 1px solid var(--red);
    color: var(--red);
}
.alert-success {
    background: var(--alert-success-bg);
    border: 1px solid var(--green);
    color: var(--green);
}

table { width: 100%; border-collapse: collapse; margin-top: 1rem; }
th, td { text-align: left; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--border); }
th { color: var(--text-dim); font-weight: 600; font-size: 0.85rem; text-transform: uppercase; }

table.filterable-table { margin-top: 0.5rem; }
table.filterable-table thead tr:first-child th a {
    color: var(--text-dim);
    text-decoration: none;
}
table.filterable-table thead tr:first-child th a:hover { color: var(--accent); }
table.filterable-table .table-filters th {
    text-transform: none;
    font-weight: 400;
    vertical-align: top;
    padding-top: 0.35rem;
    padding-bottom: 0.65rem;
    background: var(--panel);
}
table.filterable-table .table-filters input,
table.filterable-table .table-filters select {
    width: 100%;
    padding: 0.35rem 0.45rem;
    border-radius: 4px;
    border: 1px solid var(--border);
    background: var(--input-bg);
    color: var(--text);
    font-size: 0.85rem;
}
table.filterable-table .table-filter-pair {
    display: flex;
    gap: 0.35rem;
}
table.filterable-table .table-filter-pair input[name="state_region"] {
    width: 3.5rem;
    flex: 0 0 3.5rem;
}
table.filterable-table .table-filter-go {
    padding: 0.35rem 0.65rem;
    font-size: 0.8rem;
}

table.properties-table {
    width: 100%;
    min-width: 920px;
    table-layout: auto;
}
table.properties-table th,
table.properties-table td {
    vertical-align: top;
    word-break: break-word;
}
table.properties-table .col-hotel { min-width: 9rem; font-weight: 600; }
table.properties-table .col-brand { min-width: 6rem; }
table.properties-table .col-address { min-width: 12rem; max-width: 22rem; color: var(--text-dim); font-size: 0.9rem; }
table.properties-table .col-office { min-width: 7rem; }
table.properties-table .col-desk { white-space: nowrap; }
table.properties-table .col-blacklist { min-width: 8rem; }
table.properties-table .col-rating { white-space: nowrap; }
table.properties-table .col-actions { white-space: nowrap; }

table.venues-table {
    width: 100%;
    min-width: 760px;
    margin-top: 0;
}
table.venues-table th,
table.venues-table td {
    vertical-align: middle;
}
table.venues-table .col-name { min-width: 8rem; font-weight: 600; }
table.venues-table .col-address { color: var(--text-dim); font-size: 0.9rem; }
table.venues-table .col-flag { width: 4.5rem; white-space: nowrap; }
table.venues-table .col-actions { width: 1%; white-space: nowrap; }
table.venues-table .row-actions {
    margin-top: 0;
    flex-wrap: nowrap;
    gap: 0.45rem;
    justify-content: flex-end;
}
.star-rating {
    color: var(--yellow);
    letter-spacing: 0.05em;
    font-size: 0.95rem;
}

.badge { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 999px; font-size: 0.75rem; font-weight: 600; }
.badge-blacklist { background: var(--badge-blacklist-bg); color: var(--red); }
.badge-status-home { background: var(--badge-home-bg); color: var(--green); }
.badge-status-travel { background: var(--badge-travel-bg); color: var(--accent); }
.badge-status-delay { background: var(--badge-delay-bg); color: var(--yellow); }
.badge-status-unknown { background: var(--panel); color: var(--text-dim); border: 1px dashed var(--border); }

.card {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: var(--shadow);
}
.card h3 { margin-top: 0; }