/* ═══════════════════════════════════════════════════════════════════
   رفد — Global Search
   ═══════════════════════════════════════════════════════════════════ */

/* Body lock while search is open */
.gs-body-lock { overflow: hidden !important; }

/* ── Overlay ─────────────────────────────────────────────────────── */
#rifd-global-search {
  position: fixed; inset: 0; z-index: 9000;
  display: none; direction: rtl;
  font-family: Tahoma, "Segoe UI", Arial, sans-serif;
}
#rifd-global-search.gs-open {
  display: flex; align-items: flex-start; justify-content: center;
  padding-top: clamp(36px, 8vh, 88px);
}
.gs-backdrop {
  position: fixed; inset: 0;
  background: rgba(6,18,48,.72);
  backdrop-filter: blur(10px);
}

/* ── Modal ───────────────────────────────────────────────────────── */
.gs-modal {
  position: relative; z-index: 1;
  width: min(700px, calc(100vw - 20px));
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 40px 100px rgba(0,0,0,.38), 0 0 0 1px rgba(16,43,99,.08);
  overflow: hidden;
  display: flex; flex-direction: column;
  max-height: min(86vh, 620px);
  animation: gsModalIn .18s cubic-bezier(.22,1,.36,1);
}
@keyframes gsModalIn { from { transform: scale(.95) translateY(-12px); opacity:0 } to { transform:none; opacity:1 } }

/* ── Input row ───────────────────────────────────────────────────── */
.gs-input-wrap {
  display: flex; align-items: center; gap: 10px;
  padding: 14px 18px; border-bottom: 1px solid #edf3f8; flex-shrink: 0;
}
.gs-search-icon { color: #8fafc7; flex-shrink: 0; }
.gs-input {
  flex: 1; border: 0; outline: none;
  font: 14px Tahoma, "Segoe UI", Arial, sans-serif;
  color: #102b63; background: transparent; direction: rtl; min-width: 0;
}
.gs-input::placeholder { color: #b8cad8; font-size: 12px; }
.gs-input-actions { display: flex; align-items: center; gap: 5px; flex-shrink: 0; }
.gs-shortcut { display: flex; align-items: center; gap: 2px; }
.gs-shortcut kbd,
.gs-footer kbd {
  border: 1px solid #d8e6ed; border-radius: 5px;
  padding: 2px 6px; font-size: 9px; color: #8fafc7;
  background: #f4f8fb; font-family: ui-monospace, monospace;
}
.gs-shortcut span { font-size: 9px; color: #c4d3dc; }
.gs-close-btn {
  width: 28px; height: 28px; border: 1px solid #e4edf3; border-radius: 8px;
  background: #f6f9fb; color: #8fafc7; cursor: pointer;
  display: grid; place-items: center; font-size: 11px;
  margin-inline-start: 3px; transition: .15s;
}
.gs-close-btn:hover { background: #eaf1f6; color: #102b63; }

/* ── Results scroll area ─────────────────────────────────────────── */
.gs-results-wrap { flex: 1; overflow-y: auto; overscroll-behavior: contain; }
.gs-results { padding: 6px 6px 4px; }

/* Loading */
.gs-loading {
  display: flex; align-items: center; justify-content: center;
  gap: 10px; padding: 36px; color: #8fafc7; font-size: 12px;
}
.gs-spinner {
  width: 18px; height: 18px; border: 2px solid #d8e8ef;
  border-top-color: #15a98c; border-radius: 50%;
  animation: gsSpin .65s linear infinite; flex-shrink: 0;
}
@keyframes gsSpin { to { transform: rotate(360deg) } }

/* Empty / error */
.gs-empty {
  padding: 40px 24px; text-align: center; color: #8fafc7;
}
.gs-empty-icon { font-size: 30px; margin-bottom: 10px; }
.gs-empty p { font-size: 12px; color: #6f8fa3; margin: 0 0 6px; }
.gs-empty small { font-size: 9px; color: #a8bac4; }

/* ── Hint screen ─────────────────────────────────────────────────── */
.gs-hint { padding: 18px 14px 12px; }
.gs-hint-lead {
  font-size: 9px; font-weight: 800; color: #9ab0be;
  text-transform: uppercase; letter-spacing: .5px;
  margin: 0 6px 10px; display: block;
}
.gs-hint-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.gs-hint-chip {
  display: flex; align-items: center; gap: 8px;
  font-size: 11px; color: #4f6a80;
  padding: 10px 12px; border-radius: 11px;
  background: #f5f8fb; border: 1px solid #e8f0f5;
}

/* ── Section headers ─────────────────────────────────────────────── */
.gs-section-hd {
  display: flex; align-items: center; gap: 6px;
  font-size: 8.5px; font-weight: 800; color: #9ab0be;
  padding: 10px 10px 3px; text-transform: uppercase; letter-spacing: .5px;
}
.gs-count {
  margin-inline-start: auto;
  background: #edf3f8; color: #7f9aab;
  border-radius: 10px; padding: 1px 7px; font-size: 8px;
}

/* ── Category color dots ─────────────────────────────────────────── */
.gs-cat-dot {
  width: 6px; height: 6px; border-radius: 50%;
  flex-shrink: 0; display: inline-block; font-style: normal;
}
.gs-cat-requests      { background: #1d5ba6 }
.gs-cat-inventory     { background: #15a98c }
.gs-cat-users         { background: #7156c7 }
.gs-cat-announcements { background: #d99d35 }
.gs-cat-calendar      { background: #e65d65 }
.gs-cat-audit         { background: #5a7e9a }

/* ── Result items ────────────────────────────────────────────────── */
.gs-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 11px;
  cursor: pointer; transition: background .1s;
}
.gs-item:hover, .gs-item.gs-active { background: #f3f8fb; }
.gs-item.gs-active { outline: none; box-shadow: inset 3px 0 0 #15a98c; }

/* Icon */
.gs-ico {
  width: 32px; height: 32px; border-radius: 9px;
  display: grid; place-items: center; flex-shrink: 0;
}
.gs-ico-req { background: #eaf3ff; color: #1d5ba6 }
.gs-ico-inv { background: #e7f8f4; color: #15a98c }
.gs-ico-usr { background: #f0edff; color: #7156c7 }
.gs-ico-ann { background: #fff6e5; color: #d99d35 }
.gs-ico-cal { background: #fff0f1; color: #e65d65 }
.gs-ico-aud { background: #eef4f8; color: #5a7e9a }

/* Text body */
.gs-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gs-title {
  font-size: 12px; font-weight: 700; color: #102b63;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gs-sub {
  font-size: 9px; color: #7f9aab;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gs-title mark, .gs-sub mark {
  background: #fef9c3; border-radius: 2px;
  padding: 0 2px; font-style: normal;
}
.gs-en { font-size: 10px; color: #8fafc7; font-weight: 400; font-style: normal; margin-inline-start: 4px; }

/* Right-side metadata */
.gs-end { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex-shrink: 0; }

/* Pill (status) */
.gs-pill {
  display: inline-flex; align-items: center;
  padding: 3px 8px; border-radius: 12px;
  font-size: 8px; font-weight: 800; white-space: nowrap;
}
.gs-pill-new                              { background:#eaf3ff;color:#24629a }
.gs-pill-approved,.gs-pill-ready         { background:#e7f8f4;color:#128069 }
.gs-pill-under_review,.gs-pill-in_progress,.gs-pill-preparing { background:#fff4df;color:#9c6b16 }
.gs-pill-delivered,.gs-pill-completed,.gs-pill-closed { background:#eaf2eb;color:#4a7654 }
.gs-pill-rejected,.gs-pill-cancelled     { background:#fff0f1;color:#bf3e4a }

/* Badge */
.gs-badge {
  display: inline-flex; align-items: center;
  padding: 2px 7px; border-radius: 10px;
  font-size: 8px; font-weight: 700; white-space: nowrap;
  background: #edf3f8; color: #5f7a8c;
}
.gs-badge-warn  { background: #fee2e2; color: #dc2626 }
.gs-badge-aud   { background: #eef4f8; color: #5a7e9a }
.gs-prio-normal { background: #edf3f8; color: #5f7a8c }
.gs-prio-high   { background: #fff4df; color: #9c6b16 }
.gs-prio-urgent { background: #fff0f1; color: #bf3e4a }

.gs-kind-tag { font-size: 8px; color: #8fafc7; }
.gs-color-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }

/* ── Footer ─────────────────────────────────────────────────────── */
.gs-footer {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 16px; border-top: 1px solid #edf3f8;
  background: #f8fafc; flex-shrink: 0;
}
.gs-footer-tip { font-size: 9px; color: #9ab0be; display: flex; align-items: center; gap: 3px; }
.gs-footer-brand { margin-inline-start: auto; font-size: 9px; color: #b8cad6; font-weight: 700; }

/* ── FAB (floating action button) ───────────────────────────────── */
#gs-fab {
  position: fixed; left: 22px; bottom: 22px; z-index: 8900;
  width: 50px; height: 50px; border-radius: 15px; border: 0;
  background: linear-gradient(140deg, #102b63, #1d5ba6);
  color: #fff; display: grid; place-items: center; cursor: pointer;
  box-shadow: 0 10px 30px rgba(16,43,99,.32);
  transition: transform .2s, box-shadow .2s;
  animation: gsFabIn .4s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes gsFabIn { from { transform:scale(0) translateY(20px);opacity:0 } to { transform:none;opacity:1 } }
#gs-fab:hover { transform: translateY(-3px); box-shadow: 0 16px 38px rgba(16,43,99,.42); }
#gs-fab:active { transform: scale(.95); }

/* ── Nav trigger (injected into portal topbar) ──────────────────── */
.gs-nav-btn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 34px; padding: 0 11px;
  border: 1px solid rgba(255,255,255,.18); border-radius: 9px;
  background: rgba(255,255,255,.1); color: rgba(255,255,255,.82);
  font: 700 9px Tahoma, "Segoe UI", Arial, sans-serif;
  cursor: pointer; transition: .15s; margin-inline-start: 6px;
}
.gs-nav-btn kbd {
  border: 1px solid rgba(255,255,255,.22); border-radius: 4px;
  padding: 1px 5px; font-size: 8px; background: rgba(255,255,255,.1);
  color: rgba(255,255,255,.7); font-family: ui-monospace, monospace;
}
.gs-nav-btn:hover { background: rgba(255,255,255,.2); color: #fff; }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 540px) {
  #rifd-global-search.gs-open { padding-top: 0; align-items: flex-end; }
  .gs-modal { border-radius: 20px 20px 0 0; width: 100%; max-height: 88vh; }
  .gs-hint-grid { grid-template-columns: 1fr; }
  .gs-shortcut { display: none; }
}