/* Vakilem — استایل اصلی و کامپوننت‌های مشترک. سبک Trust & Authority، RTL، موبایل‌اول. */
:root {
	--vk-color-primary: #1E3A8A;      /* آبی اعتماد */
	--vk-color-primary-700: #1E40AF;
	--vk-color-accent: #B45309;       /* کهربایی CTA */
	--vk-color-bg: #F8FAFC;
	--vk-color-fg: #0F172A;
	--vk-color-muted: #64748B;
	--vk-color-border: #e2e8f0;
	--vk-radius: 12px;
	--vk-space: 8px;
	--vk-container: 1200px;
}

.vk-main { max-width: var(--vk-container); margin-inline: auto; padding: 16px; }

/* ---------- بردکرامپ ---------- */
.vk-breadcrumb {
	margin-bottom: 18px; font-size: .82rem;
	background: var(--vk-bc-bg, #fff); border: 1px solid var(--vk-bc-border, var(--vk-color-border));
	border-radius: 999px; padding: 9px 16px;
	box-shadow: 0 1px 3px rgba(15,23,42,.04);
}
.vk-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.vk-breadcrumb__item { display: inline-flex; align-items: center; gap: 4px; color: var(--vk-color-muted); }
.vk-breadcrumb__item:not(:last-child)::after { content: "›"; color: #cbd5e1; margin-inline-start: 6px; font-size: 1rem; line-height: 1; }
.vk-breadcrumb a { color: var(--vk-color-primary-700); text-decoration: none; transition: color .12s ease; }
.vk-breadcrumb a:hover { color: var(--vk-color-accent); }
.vk-breadcrumb [aria-current="page"] { color: var(--vk-color-fg); font-weight: 700; }

/* ---------- دکمه ---------- */
.vk-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 7px;
	min-height: 44px; padding: 0 18px; border-radius: 10px; border: 0; cursor: pointer;
	font-weight: 700; text-decoration: none; font-size: .95rem; font-family: inherit;
	transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease, filter .15s ease;
}
.vk-btn:active { transform: scale(.98); }
.vk-btn .vk-ico { flex-shrink: 0; }
.vk-btn--primary { background: var(--vk-color-primary); color: #fff; }
.vk-btn--primary:hover { background: var(--vk-color-primary-700); color: #fff; }
.vk-btn--accent { background: var(--vk-color-accent); color: #fff; }
.vk-btn--accent:hover { filter: brightness(.95); color: #fff; }
.vk-btn--call { background: var(--vk-btn-call, var(--vk-color-primary)); color: #fff; }
.vk-btn--call:hover { filter: brightness(.92); color: #fff; }
.vk-btn--whatsapp { background: var(--vk-btn-whatsapp, #25D366); color: #fff; }
.vk-btn--whatsapp:hover { filter: brightness(.95); color: #fff; }
.vk-btn--telegram { background: var(--vk-btn-telegram, #229ED9); color: #fff; }
.vk-btn--telegram:hover { filter: brightness(.95); color: #fff; }
.vk-btn--bale { background: var(--vk-btn-bale, #5C2D91); color: #fff; }
.vk-btn--bale:hover { filter: brightness(.95); color: #fff; }
.vk-btn--ghost { background: #fff; color: var(--vk-color-primary-700); border: 1px solid var(--vk-color-border); }
.vk-btn--ghost:hover { border-color: var(--vk-color-primary); color: var(--vk-color-primary-700); }
.vk-btn--block { display: flex; width: 100%; margin-top: 12px; }

/* ---------- combobox جستجوپذیر (مشترک: فیلتر + جستجوی هیرو) ---------- */
.vk-combo { position: relative; flex: 1 1 160px; }
.vk-combo-hidden { display: none !important; }
.vk-combo__input {
	width: 100%; min-height: 44px; padding-block: 0; padding-inline-start: 12px; padding-inline-end: 34px;
	border: 1px solid var(--vk-color-border); border-radius: 10px;
	background: var(--vk-color-bg); color: var(--vk-color-fg); font-family: inherit; font-size: .9rem;
}
.vk-combo::after { content: "▾"; position: absolute; inset-inline-end: 14px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--vk-color-muted); font-size: .8rem; }
.vk-combo__input:focus { outline: 2px solid var(--vk-color-primary); border-color: var(--vk-color-primary); }
.vk-combo__list {
	position: absolute; inset-inline: 0; top: calc(100% + 4px); z-index: 50;
	max-height: 240px; overflow-y: auto; margin: 0; padding: 4px; list-style: none;
	background: #fff; border: 1px solid var(--vk-color-border); border-radius: 10px;
	box-shadow: 0 8px 28px rgba(15,23,42,.12);
}
.vk-combo__option { padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: .9rem; }
.vk-combo__option:hover, .vk-combo__option.is-active { background: var(--vk-color-bg); }
.vk-combo__option.is-selected { color: var(--vk-color-primary-700); font-weight: 700; }

/* ---------- کارت ---------- */
.vk-card {
	background: #fff; border: 1px solid var(--vk-color-border);
	border-radius: var(--vk-radius); padding: 18px;
}
.vk-card__title { font-size: 1.15rem; margin: 0 0 12px; color: var(--vk-color-fg); }

/* ---------- متن ---------- */
.vk-prose { line-height: 1.85; color: #1f2937; }
.vk-prose p:last-child { margin-bottom: 0; }

/* ---------- ستاره ---------- */
/* جهت پرشدن از راست (هم‌جهت با ویجت امتیازدهی تعاملی) */
.vk-stars { display: inline-flex; gap: 2px; direction: rtl; }
.vk-star { color: #cbd5e1; }
.vk-star.is-full { color: #f59e0b; }
.vk-star.is-half { color: #f59e0b; opacity: .6; }

/* ---------- بَج ---------- */
.vk-badge {
	background: #eef2ff; color: var(--vk-color-primary-700);
	border-radius: 999px; padding: 5px 12px; font-size: .82rem; font-weight: 600;
}
.vk-badge--city { background: #ecfdf5; color: #047857; }
.vk-badge--best { background: #fffbeb; color: #b45309; border: 1px solid #fde68a; }
.vk-badge--city a { color: inherit; text-decoration: none; }

/* بردکرامپ دوم (مکانی) — کمی فشرده‌تر زیر بردکرامپ اصلی */
.vk-breadcrumb--location { margin-top: -6px; }
.vk-breadcrumb--location ol { opacity: .92; }

/* ---------- نتایج جستجو ---------- */
.vk-search { max-width: 860px; margin-inline: auto; }
.vk-search__head { margin-bottom: 22px; }
.vk-search__title { font-size: clamp(1.3rem, 3vw, 1.8rem); font-weight: 800; color: var(--vk-color-fg); margin: 0 0 14px; }
.vk-search__form .search-form, .vk-search__form form { display: flex; gap: 8px; }
.vk-search__form input[type="search"], .vk-search__form input.search-field, .vk-search__form input[type="text"] {
	flex: 1; min-height: 46px; padding: 0 14px; border: 1px solid var(--vk-color-border); border-radius: 10px; font-family: inherit; background: #fff;
}
.vk-search__form input[type="submit"], .vk-search__form .search-submit, .vk-search__form button[type="submit"] {
	min-height: 46px; padding: 0 22px; border: 0; border-radius: 10px; background: var(--vk-color-primary); color: #fff; font-weight: 700; cursor: pointer; font-family: inherit;
}
.vk-search__terms { margin-bottom: 20px; }
.vk-search__chips { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.vk-search__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.vk-search__item { background: #fff; border: 1px solid var(--vk-color-border); border-radius: var(--vk-radius); padding: 16px 18px; display: flex; gap: 14px; align-items: flex-start; }
.vk-search__thumb { flex-shrink: 0; }
.vk-search__thumb img { width: 72px; height: 72px; object-fit: cover; border-radius: 10px; display: block; }
.vk-search__body { min-width: 0; flex: 1; }
.vk-search__head-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.vk-search__link { font-size: 1.1rem; font-weight: 700; color: var(--vk-color-primary-700); text-decoration: none; }
.vk-search__link:hover { text-decoration: underline; }
.vk-search__type { font-size: .72rem; background: var(--vk-color-bg); color: var(--vk-color-muted); border: 1px solid var(--vk-color-border); border-radius: 999px; padding: 2px 10px; }
.vk-search__excerpt { margin: 8px 0 0; color: #475569; font-size: .92rem; line-height: 1.9; }
.vk-search__empty { padding: 32px; text-align: center; color: var(--vk-color-muted); background: #fff; border: 1px dashed var(--vk-color-border); border-radius: var(--vk-radius); }
.vk-check-inline { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; }
.vk-check-inline input { width: auto; }

/* ---------- گرید ---------- */
.vk-grid { display: grid; gap: 16px; grid-template-columns: 1fr; }
.vk-grid--lawyers { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

/* ---------- کارت وکیل (کامپوننت مشترک) ---------- */
.vk-lawyer-card { display: flex; flex-direction: column; text-align: center; height: 100%; transition: box-shadow .18s ease, transform .18s ease; }
.vk-lawyer-card:hover { box-shadow: 0 10px 28px rgba(15,23,42,.10); transform: translateY(-2px); }
.vk-lawyer-card__avatar {
	width: 88px; height: 88px; border-radius: 50%; overflow: hidden; margin: 0 auto 10px;
	background: var(--vk-color-primary); display: grid; place-items: center;
	border: 3px solid #fff; box-shadow: 0 2px 10px rgba(15,23,42,.12);
}
.vk-lawyer-card__avatar a, .vk-lawyer-card__avatar img { display: block; width: 100%; height: 100%; }
.vk-lawyer-card__avatar img { object-fit: cover; }
.vk-lawyer-card__name { display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; font-size: 1.05rem; margin: 0 0 4px; }
.vk-lawyer-card__name a { color: var(--vk-color-primary-700); text-decoration: none; font-weight: 800; }
.vk-lawyer-card__name a:hover { color: var(--vk-color-accent); }
.vk-verified { display: inline-flex; align-items: center; gap: 3px; background: #dbeafe; color: #1e40af; border-radius: 999px; padding: 2px 8px; font-size: .68rem; font-weight: 700; }
.vk-verified svg { color: #2563eb; }
.vk-lawyer-card__rating { display: inline-flex; align-items: center; gap: 6px; justify-content: center; }
.vk-lawyer-card__count { font-size: .8rem; color: var(--vk-color-muted); }
.vk-lawyer-card__loc { display: flex; align-items: center; justify-content: center; gap: 4px; font-size: .82rem; color: var(--vk-color-muted); margin: 8px 0 0; }
.vk-lawyer-card__loc svg { color: var(--vk-color-accent); flex-shrink: 0; }
.vk-lawyer-card__tagline { font-size: .82rem; color: var(--vk-color-muted); margin: 4px 0 0; }
.vk-lawyer-card__areas { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 12px 0 4px; }
.vk-chip {
	font-size: .72rem; background: var(--vk-color-bg); border: 1px solid var(--vk-color-border);
	border-radius: 999px; padding: 3px 10px; color: var(--vk-color-muted); text-decoration: none; transition: border-color .12s ease, color .12s ease;
}
.vk-chip:hover { border-color: var(--vk-color-primary); color: var(--vk-color-primary-700); }
.vk-lawyer-card__cta { margin-top: auto; }

/* ---------- صفحه‌بندی ---------- */
.vk-pagination { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 24px; }
.vk-pagination .page-numbers {
	min-width: 40px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center;
	padding: 0 10px; border: 1px solid var(--vk-color-border); border-radius: 8px;
	color: var(--vk-color-fg); text-decoration: none; font-size: .9rem;
}
.vk-pagination .page-numbers.current { background: var(--vk-color-primary); color: #fff; border-color: var(--vk-color-primary); }
.vk-pagination a.page-numbers:hover { border-color: var(--vk-color-primary); }
