/* OKL /team outbound texting styles. [OKLSMS1012] DESIGN.md section 8.
 * Only what DreamsPOS lacks, and only .okl-sms-* selectors (plus the module's own ids): this file prints inside
 * wp_head() BEFORE the DreamsPOS bootstrap / style.css links, so DreamsPOS wins every rule of equal specificity.
 * Never restyle bare .badge, .bg-*, .table, .btn, .card or .nav-link here. ASCII only. */

/* The hidden attribute must win over any display rule on these blocks. */
.okl-sms-pane[hidden],
.okl-sms-state-line[hidden],
#okl-sms-card-form[hidden],
#okl-sms-card-twofa-wrap[hidden],
#okl-sms-card-unavail-generic[hidden],
#okl-sms-card-unavail-pending[hidden],
#okl-sms-card-start[hidden],
#oklSmsNotInstalled[hidden],
#oklSmsEventsEmpty[hidden],
#oklSmsPeopleEmpty[hidden],
#oklSmsOutboxEmpty[hidden] { display: none; }

/* tabs are buttons, switched by okl-sms.js */
.okl-sms-tabs .nav-link { cursor: pointer; }

/* rows of buttons and inputs */
.okl-sms-btnrow,
.okl-sms-coderow-controls {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}
.okl-sms-code-input {
	max-width: 150px;
	letter-spacing: 0.25em;
	font-variant-numeric: tabular-nums;
}
.okl-sms-login-step .okl-sms-code-input { max-width: none; }
.okl-sms-linkbtn {
	padding-left: 0;
	padding-right: 0;
	text-decoration: underline;
}
.okl-sms-linkbtn:disabled { text-decoration: none; }

/* owner console: status tab */
.okl-sms-checklist { padding-left: 1.4rem; }
.okl-sms-checklist li { margin-bottom: 4px; }
.okl-sms-section {
	border-top: 1px solid #e8eaed;
	padding-top: 12px;
}
.okl-sms-events li { margin-bottom: 4px; }

/* owner console: people + outbox tables */
.okl-sms-table td { vertical-align: top; }
.okl-sms-row { cursor: pointer; }
.okl-sms-row:hover td,
.okl-sms-row[aria-expanded="true"] td,
.okl-sms-detail td { background: #fbfcfd; }
.okl-sms-row:focus { outline: 2px solid #fd7e14; outline-offset: -2px; }
.okl-sms-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}
.okl-sms-actions .btn {
	padding: 2px 6px;
	line-height: 1.2;
	white-space: nowrap;
}
.okl-sms-inline { max-width: 680px; }
.okl-sms-preview {
	white-space: pre-wrap;
	overflow-wrap: anywhere;
	background: #f6f7f9;
	border: 1px solid #e8eaed;
	border-radius: 6px;
	padding: 8px 10px;
	font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}

@media (max-width: 767.98px) {
	.okl-sms-table td,
	.okl-sms-table th { font-size: 13px; padding: 6px; }
	.okl-sms-code-input { max-width: 100%; }
}