/*!
 * Rules tab — list table + add/edit form. Native-looking, lightweight.
 */

.lmsc-rules-wrap { margin: 0; }

.lmsc-rules-header {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 16px; margin: 4px 0 18px;
}
.lmsc-rules-header h2 { margin: 0 0 4px; font-size: 18px; }
.lmsc-rules-header .description { margin: 0; color: #50575e; }
.lmsc-rules-add .dashicons {
    font-size: 16px; width: 16px; height: 16px; vertical-align: -3px; margin-right: 2px;
}

.lmsc-rules-search { margin: 0 0 8px; }
.lmsc-rules-search .search-box { float: none; display: flex; gap: 6px; }

.lmsc-rules-pill {
    display: inline-block; padding: 2px 10px; border-radius: 12px;
    font-size: 11px; font-weight: 600; letter-spacing: .02em;
}
.lmsc-rules-pill.is-enabled  { background: #e7f4ea; color: #1e4620; }
.lmsc-rules-pill.is-disabled { background: #f1f1f1; color: #757575; }

.lmsc-rules-url { font-size: 12px; color: #2271b1; word-break: break-all; }
.lmsc-rules-muted { color: #a7aaad; }
.lmsc-rules-order { display: inline-block; min-width: 28px; text-align: center; }

table.wp-list-table .column-order      { width: 110px; }
table.wp-list-table .column-status     { width: 100px; }
table.wp-list-table .column-login_url,
table.wp-list-table .column-logout_url { width: 22%; }

/* Sortable header — make label + arrows lay out as one non-wrapping row.
   Without this, narrow columns (like Order) push the arrow indicator below the
   label, which is why "ORDER" looked stacked while "CONDITION" looked inline. */
table.wp-list-table thead th.sortable a,
table.wp-list-table thead th.sorted a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}
table.wp-list-table thead th.sortable a .sorting-indicator,
table.wp-list-table thead th.sorted a .sorting-indicator {
    margin-left: 2px;
    flex-shrink: 0;
}

/* Bulk actions select — WP's default doesn't leave room for the chevron so the
   label crashes into the arrow. Reserve right-side padding and a sensible min
   width. Applies to BOTH the top (.tablenav.top) and bottom (.tablenav.bottom)
   toolbars on the rules table. */
.lmsc-v5 .tablenav .bulkactions select[name="action"],
.lmsc-v5 .tablenav .bulkactions select[name="action2"] {
    min-width: 140px;
    padding-right: 26px !important;
}
.lmsc-v5 .tablenav .bulkactions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

tr.lmsc-rules-row.ui-sortable-helper {
    background: #fffbea; box-shadow: 0 4px 16px rgba(0,0,0,.06);
}

.lmsc-rules-footnote { margin-top: 12px; color: #757575; }

/* Edit screen */
.lmsc-rules-edit h1 { margin: 4px 0 16px; font-size: 22px; }
.lmsc-rules-back {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 13px; font-weight: normal; color: #50575e; text-decoration: none;
}
.lmsc-rules-back:hover { color: #2271b1; }
.lmsc-rules-back .dashicons { font-size: 16px; width: 16px; height: 16px; }

.lmsc-rules-form .form-table th { width: 200px; }
.lmsc-rules-form select.lmsc-rules-condition-type { min-width: 320px; }
.lmsc-rules-form .lmsc-rules-value-field select,
.lmsc-rules-form .lmsc-rules-value-field input[type=text],
.lmsc-rules-form .lmsc-rules-value-field input[type=email] {
    min-width: 320px;
}

/* Sortable handle hint */
.wp-list-table tr.lmsc-rules-row { cursor: ns-resize; }
.wp-list-table tr.lmsc-rules-row td:first-child,
.wp-list-table tr.lmsc-rules-row td.check-column { cursor: default; }
