/* PoliciesRules.css -- scoped layout for sub-tab content.
   Sub-tab nav uses SegmentedControl; page structure uses VerticalStackTemplate;
   sub-tab panels use Panel; cards use Card; banners use StatusBanner;
   access tags use Badge. Only bespoke layouts live here.
*/

.policies-rules-module {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.policies-rules-sub-tabs {
    display: flex;
}

/* House Rules form -- sections stacked inside Panel.content */

.policies-rules-house {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/*
 * Inline field layout (used by Booking Windows / Entitlement Behaviour / Group
 * Exclusion). Row shape: [label ~240px][control auto][help flex remaining].
 *
 * .form-field-inline (FormField.css) sets flex-direction: row + gap-3 and a
 * label min-width. We layer PoliciesRules-specific overrides via module scope.
 */
.policies-rules-module .form-field-inline {
    align-items: center;
    flex-wrap: wrap;
    row-gap: var(--space-1);
}

.policies-rules-module .form-field-inline .form-label {
    flex: 0 0 240px; /* grid-column width: House Rules labels wrap below 160px */
}

.policies-rules-module .form-field-inline .input-wrapper {
    flex: 0 0 auto;
    width: auto;
}

.policies-rules-module .form-field-inline .input-wrapper .input {
    width: auto;
    min-width: var(--space-20);
}

.policies-rules-module .form-field-inline .segmented-control {
    flex: 0 0 auto;
}

.policies-rules-module .form-field-inline .form-message {
    flex: 1 1 var(--space-40);
    min-width: 0;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    line-height: var(--line-height-normal);
}

.policies-rules-module .form-field--reverse.form-field-inline .checkbox {
    flex: 0 0 auto;
}

.policies-rules-module .form-field--reverse.form-field-inline .form-label {
    flex: 0 0 auto;
}

@media (max-width: 768px) {
    .policies-rules-module .form-field-inline {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-1);
    }
    .policies-rules-module .form-field-inline .form-label,
    .policies-rules-module .form-field-inline .input-wrapper,
    .policies-rules-module .form-field-inline .segmented-control,
    .policies-rules-module .form-field-inline .form-message {
        flex: 0 0 auto;
        width: 100%;
    }
}

/* Stay Brackets: transposed 4-col editor. First column is the row label
   ("Min nights" / "Max nights"), remaining 3 columns hold the bracket values
   per SHORT / MEDIUM / LONG. */

.policies-rules-brackets {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.policies-rules-brackets__row {
    display: grid;
    grid-template-columns: 120px repeat(3, 100px); /* grid-column widths for tabular alignment, no token suite */
    gap: var(--space-3);
    align-items: center;
}

.policies-rules-brackets__header .policies-rules-brackets__col-code {
    font-size: var(--text-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.policies-rules-brackets__row-label {
    font-size: var(--text-sm);
    color: var(--text-primary);
    font-weight: var(--font-weight-medium);
}

.policies-rules-brackets__col-code {
    font-weight: var(--font-weight-medium);
    color: var(--text-primary);
    font-size: var(--text-sm);
}

/* Bound the input wrapper to the 100px cell so the box matches the short value. */
.policies-rules-brackets__col-num .input-wrapper {
    width: 100%;
}

.policies-rules-brackets__hint {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

/* DataTable row actions (BoardTypesView) */

.policies-rules-row-actions {
    display: flex;
    gap: var(--space-1);
    justify-content: flex-end;
}

/* Modal body stack (Modal organism has no body gap) */

.policies-rules-modal-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.policies-rules-modal-sub {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.policies-rules-modal-danger {
    display: flex;
    justify-content: flex-start;
    padding-top: var(--space-2);
    border-top: 1px solid var(--border-subtle);
}

/* Card list (Restaurant / Facility rules) */

.policies-rules-cards {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.policies-rules-card__rules {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.policies-rules-card__empty {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    font-style: italic;
}

/* Single rule row inside a Card */

.policies-rules-rule-row {
    display: grid;
    grid-template-columns: 80px 100px 130px 1fr; /* grid-column widths for tabular alignment, no token suite */
    gap: var(--space-2);
    align-items: center;
    font-size: var(--text-xs);
    color: var(--text-body);
}

.policies-rules-rule__roomcat {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.policies-rules-rule__hint {
    color: var(--text-secondary);
}

/* Pool footer rows (inside the Choice Pools Panel) */

.policies-rules-pools__list {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.policies-rules-pool-row {
    display: grid;
    grid-template-columns: 1fr 2fr auto;
    gap: var(--space-2);
    align-items: center;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--border-radius-sm);
    font-size: var(--text-xs);
}

.policies-rules-pool__label {
    font-weight: var(--font-weight-medium);
    color: var(--text-primary);
}

.policies-rules-pool__members {
    color: var(--text-secondary);
}

.policies-rules-pool__actions {
    display: flex;
    gap: var(--space-1);
    justify-self: end;
}

/* Inline-editable draft table (Rules modal) -- no atom covers per-row
   input rendering driven by row state */

.policies-rules-draft-table {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.policies-rules-draft-table__header,
.policies-rules-draft-row {
    display: grid;
    grid-template-columns: 140px 120px 130px 1fr 80px; /* grid-column widths for tabular alignment, no token suite */
    gap: var(--space-2);
    align-items: center;
    padding: var(--space-2);
    font-size: var(--text-xs);
}

.policies-rules-draft-table__header {
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--border-subtle);
}

.policies-rules-draft-row {
    border-radius: var(--border-radius-sm);
}

.policies-rules-draft-table__add {
    display: flex;
    justify-content: flex-start;
    padding-top: var(--space-2);
}

.policies-rules-draft-row__details {
    min-width: 0;
}

.policies-rules-draft-row__muted {
    color: var(--text-muted);
    font-style: italic;
}

/* Quota triplet + pool picker (Restaurant rules draft) */

.policies-rules-quota-cell {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
}

.policies-rules-quota-cell__triplet {
    display: grid;
    grid-template-columns: repeat(3, 56px); /* grid-column width: compact number inputs, no token suite */
    gap: var(--space-1);
}

.policies-rules-quota-cell__pool {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.policies-rules-quota-cell__label {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.policies-rules-meal-cell {
    display: flex;
    gap: var(--space-2);
}

/* Facility rules limit cell */

.policies-rules-limit-cell {
    display: inline-flex;
    gap: var(--space-2);
    align-items: center;
    flex-wrap: wrap;
}

.policies-rules-limit-cell__max {
    width: 72px; /* grid-column width: compact number input, no token suite */
}

/* Restaurant picker modal (Panel-level "+ Rule" flow) */

.policies-rules-picker {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.policies-rules-picker__item {
    display: grid;
    grid-template-columns: 1fr 120px auto; /* grid-column widths for name/type/badge layout, no token suite */
    gap: var(--space-2);
    align-items: center;
    width: 100%;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--border-radius-sm);
    font-size: var(--text-sm);
    text-align: left;
    cursor: pointer;
}

.policies-rules-picker__item:hover {
    background: var(--bg-hover);
    border-color: var(--border-strong);
}

.policies-rules-picker__name {
    font-weight: var(--font-weight-medium);
    color: var(--text-primary);
}

.policies-rules-picker__type {
    color: var(--text-secondary);
    font-size: var(--text-xs);
}

/* Choice pool members list (ChoiceGroupModal -- read-only) */

.policies-rules-pool-members {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-3);
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--border-radius-sm);
}

.policies-rules-pool-members__label {
    font-size: var(--text-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.policies-rules-pool-members__list {
    padding-left: var(--space-4);
    font-size: var(--text-sm);
    color: var(--text-primary);
}

/* Edit-meta link inside the rules modal */

.policies-rules-modal__meta-link {
    display: inline-block;
    font-size: var(--text-xs);
    color: var(--color-accent, var(--text-link, var(--text-primary)));
    text-decoration: underline;
}

.policies-rules-modal__meta-link:hover {
    text-decoration: none;
}

/* Loyalty Benefits (Tab 5) -- tier panels use ExpandablePanel;
   benefit rows use DataTable. Minimal additions needed. */

.policies-rules-loyalty-tier .expandable-panel-content {
    padding: var(--space-3);
}

.policies-rules-loyalty-tier .data-table-container {
    border: none;
}

.policies-rules-loyalty-tier .table-cell-actions {
    display: flex;
    gap: var(--space-1);
    justify-content: flex-end;
}
