/* «البحث» (board B11) — component rules only, on the «مِحْوَر» tokens and classes of lifeos.css (W0). */
.w4a-search { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.w4a-search .ci-page-message:empty { display: none; }
.ci-search-form { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
/* The active search box of B11: accent border + focus halo, input grows, submit sits at the end. */
.ci-search-field { max-width: 720px; min-height: 48px; padding-inline-end: 6px; border-color: var(--accent); background: var(--surface); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); color: var(--ink-3); }
.ci-search-field input { font-size: 16px; min-height: 44px; }
.ci-search-field input::-webkit-search-cancel-button { cursor: pointer; }
.ci-search-field .btn { flex: none; }
.ci-search-tools { align-items: center; }
.ci-check-row { display: flex; align-items: center; gap: 10px; min-block-size: 40px; cursor: pointer; font-size: 14px; color: var(--ink-2); }
.ci-check-row input { inline-size: 20px; block-size: 20px; flex: none; accent-color: var(--accent); }
.ci-search-more > summary { display: flex; align-items: center; gap: 6px; min-block-size: 40px; color: var(--ink-2); font-size: 13.5px; font-weight: 500; cursor: pointer; list-style: none; }
.ci-search-more > summary::-webkit-details-marker { display: none; }
.ci-search-more[open] { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.ci-type-options { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; border: 0; min-width: 0; }
.ci-type-options > legend { margin-block-end: 6px; padding: 0; }
.ci-type-option { cursor: pointer; }
.ci-type-option input { inline-size: 14px; block-size: 14px; margin: 0; accent-color: var(--accent); }
.ci-type-option:has(input:checked) { background: var(--accent-soft); color: var(--accent-soft-ink); border-color: transparent; }
.ci-search-grid { gap: 12px 16px; }
.ci-field-error { color: var(--danger-ink); }
.ci-field-error:empty { display: none; }

/* results */
.ci-results { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.ci-search-scope { gap: 6px; }
.ci-type-chips .badge { margin-inline-start: 6px; }
.ci-type-chips .chip.sel .badge { background: color-mix(in srgb, var(--on-accent) 22%, transparent); color: var(--on-accent); }
.ci-search-result { align-items: flex-start; }
.ci-result-icon { color: var(--ink-3); margin-block-start: 2px; flex: none; }
.ci-result-main { display: flex; flex-direction: column; gap: 2px; }
.ci-result-main .t { overflow-wrap: anywhere; }
.ci-match > summary, .ci-snippets > summary { min-block-size: 32px; display: inline-flex; align-items: center; font-size: 12.5px; color: var(--ink-3); cursor: pointer; }
.ci-match[open], .ci-snippets[open] { margin-block-start: 6px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); display: flex; flex-direction: column; gap: 6px; }
.ci-match-list { display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.ci-match-list > li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.ci-record-id { color: var(--ink-3); overflow-wrap: anywhere; }
.ci-snippet { display: flex; flex-direction: column; gap: 4px; }
.ci-prose { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; line-height: 1.6; }
.ci-search-empty .t bdi { font-weight: 600; }

/* Phone widths (360–390): 44px touch targets, 16px input, full-width search box. */
@media (max-width: 600px) {
  .w4a-search { gap: 20px; }
  .ci-search-field { max-width: none; }
  .w4a-search :is(.btn, .btn-sm, .chip-btn, summary) { min-block-size: 44px; }
  .w4a-search :is(.input, .select) { font-size: 16px; min-block-size: 44px; }
  .ci-search-result { flex-wrap: wrap; }
  .ci-search-result > .btn { margin-inline-start: 32px; }
}