/* Global site styles - single file for easy overrides */

:root{
  --brand-blue:#2563eb;
  --brand-blue-dark:#1d4ed8;
  --text-dark:#111827;
  --text-muted:#6b7280;
  --border:#e5e7eb;
  --green:#16a34a;
  --red:#dc2626;
}

/* Typography helpers */
.hero__title{font-size:3rem;line-height:3.5rem;color:var(--text-dark);font-weight:800}
.clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Search box */
.search{position:relative;display:flex;align-items:stretch;border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.search__prefix{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-weight:600;user-select:none}
.search__input{flex:1;height:56px;border:0;padding:0 56px 0 112px;font-size:1.125rem;outline:0}
.search__input:focus{outline:none}
.search__sep{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#ef4444}
.search__status{position:absolute;right:32px;top:50%;transform:translateY(-50%)}
.search__button{background:var(--brand-blue);color:#fff;padding:0 24px;height:56px;font-weight:600;min-width:220px;text-align:center;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;font-size:1.125rem}
.search__button:disabled{opacity:.9}
@media (max-width: 420px){
  .search__button{min-width:180px;height:56px}
}

/* Ensure the check button remains visible on small mobile screens */
@media (max-width: 480px){
  .search{overflow:visible}
  .search__button{min-width:140px;padding:0 16px;font-size:1rem}
}
@media (max-width: 360px){
  .search__button{min-width:120px}
}

/* Small inline spinner */
.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;visibility:hidden}
.search__button.is-loading .spinner{visibility:visible}
@keyframes spin{to{transform:rotate(360deg)}}
.search__button:hover{background:var(--brand-blue-dark)}

/* Sidebar layout helpers for RTL/LTR */
.content--ltr{margin-left:16rem}
.content--rtl{margin-right:16rem}
.sidebar-fixed--ltr{left:0}
.sidebar-fixed--rtl{right:0}