/* =========================================================
   ADVOKAT — umumiy uslublar (barcha sahifalar uchun)
   G'oya: rasmiy hujjat — to'q ko'k fon, gilyosh (himoya naqshi),
   muhr kabi oltin rang va bosiladigan 3D tugmalar.
   ========================================================= */

/* ===== 1. Ranglar va shriftlar ===== */
:root {
  --navy: #0e2240;        /* rasmiy to'q ko'k */
  --navy-deep: #091731;
  --navy-soft: #1b3763;
  --gold: #e3b53b;        /* muhr oltini */
  --gold-face: #f0c855;
  --gold-ledge: #a07812;  /* 3D tugmaning pastki qirrasi */
  --gold-tint: #fff3cf;

  --paper: #eef2f7;       /* sahifa foni */
  --sheet: #ffffff;       /* kartochka */
  --ink: #12213a;         /* asosiy matn */
  --muted: #5b6b82;
  --line: #d8e0ea;
  --link: #1d5bbf;
  --mark: #ffe48a;
  --danger: #b4232c;

  --ledge-light: #c5d0de; /* oq 3D tugma qirrasi */
  --shadow: 0 1px 2px rgba(14, 34, 64, 0.06), 0 8px 24px rgba(14, 34, 64, 0.08);
  --radius: 16px;

  --font-ui: "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-law: "Literata", Georgia, "Times New Roman", serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --navy: #0a1830;
    --navy-deep: #060f20;
    --navy-soft: #1a3158;
    --paper: #0b1426;
    --sheet: #12203a;
    --ink: #e6ecf5;
    --muted: #93a3bc;
    --line: #23375a;
    --link: #7fb0ff;
    --mark: #6b5414;
    --gold-tint: #3a2f10;
    --danger: #ff8f96;
    --ledge-light: #0a1428;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 10px 28px rgba(0, 0, 0, 0.35);
  }
}

/* ===== 2. Asos ===== */
* { box-sizing: border-box; }

[hidden] { display: none !important; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: 17px;
  line-height: 1.55;
  overflow-x: clip; /* to'liq kenglikdagi fonlar gorizontal aylantirish chiqarmasin */
  /* Pastki qism har doim ekranning pastida turadi */
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

body > main { flex: 1 0 auto; width: 100%; }

a { color: var(--link); text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }

:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
  border-radius: 6px;
}

.wrap {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 16px;
}

.visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

mark {
  background: var(--mark);
  color: inherit;
  border-radius: 3px;
  box-shadow: 0 0 0 2px var(--mark);
}

/* Gilyosh naqshi — rasmiy hujjatlardagi himoya chiziqlari kabi */
.ask::before,
.page-head::before,
.site-header {
  background:
    repeating-radial-gradient(circle at 12% 130%, transparent 0 13px, rgba(227, 181, 59, 0.09) 13px 14px),
    repeating-radial-gradient(circle at 92% -40%, transparent 0 13px, rgba(255, 255, 255, 0.05) 13px 14px),
    linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 70%, var(--navy-soft) 100%);
}

/* ===== 3. 3D tugmalar ===== */
/* Asosiy tugma: oltin yuz + pastki qirra. Bosilganda pastga botadi. */
.btn,
.search button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font: inherit;
  font-weight: 700;
  text-decoration: none;
  color: var(--navy-deep);
  background: linear-gradient(180deg, var(--gold-face), var(--gold));
  border: 0;
  border-radius: 12px;
  padding: 12px 22px;
  cursor: pointer;
  box-shadow:
    0 5px 0 var(--gold-ledge),
    0 10px 18px rgba(9, 23, 49, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.55);
  transform: translateY(0);
  transition: transform 0.08s ease, box-shadow 0.08s ease, filter 0.15s ease;
}

.btn:hover,
.search button:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
  box-shadow:
    0 6px 0 var(--gold-ledge),
    0 12px 22px rgba(9, 23, 49, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.btn:active,
.search button:active {
  transform: translateY(5px);
  box-shadow:
    0 0 0 var(--gold-ledge),
    0 3px 6px rgba(9, 23, 49, 0.25),
    inset 0 2px 4px rgba(0, 0, 0, 0.12);
}

.btn:disabled { opacity: 0.6; cursor: wait; transform: translateY(3px); }

/* Ikkinchi darajali tugma: oq yuz */
.btn-quiet {
  color: var(--ink);
  background: linear-gradient(180deg, var(--sheet), var(--paper));
  box-shadow:
    0 5px 0 var(--ledge-light),
    0 10px 18px rgba(9, 23, 49, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.btn-quiet:hover {
  box-shadow:
    0 6px 0 var(--ledge-light),
    0 12px 22px rgba(9, 23, 49, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.btn-quiet:active {
  box-shadow: 0 0 0 var(--ledge-light), 0 2px 4px rgba(9, 23, 49, 0.15);
}

/* O'chirish tugmasi */
.btn-danger {
  color: var(--danger);
  background: linear-gradient(180deg, var(--sheet), var(--paper));
  box-shadow:
    0 5px 0 rgba(180, 35, 44, 0.35),
    0 10px 18px rgba(9, 23, 49, 0.12);
}

.btn-danger:hover {
  box-shadow:
    0 6px 0 rgba(180, 35, 44, 0.45),
    0 12px 22px rgba(9, 23, 49, 0.14);
}

.btn-danger:active { box-shadow: 0 0 0 rgba(180, 35, 44, 0.35); }

.btn-sm { padding: 7px 14px; font-size: 14px; border-radius: 10px; }

/* Kichik tanlov tugmalari (chiplar): bosilgan holati — botib turadi */
.example {
  font: inherit;
  font-size: 15px;
  font-weight: 500;
  color: var(--ink);
  background: linear-gradient(180deg, var(--sheet), var(--paper));
  border: 0;
  border-radius: 999px;
  padding: 7px 15px;
  cursor: pointer;
  box-shadow:
    0 3px 0 var(--ledge-light),
    0 6px 12px rgba(9, 23, 49, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
  transition: transform 0.08s ease, box-shadow 0.08s ease;
}

.example:hover { transform: translateY(-1px); }

.example:active {
  transform: translateY(3px);
  box-shadow: 0 0 0 var(--ledge-light), 0 2px 4px rgba(9, 23, 49, 0.12);
}

.example[aria-pressed="true"] {
  color: #fff;
  background: linear-gradient(180deg, var(--navy-soft), var(--navy));
  transform: translateY(2px);
  box-shadow: 0 1px 0 var(--navy-deep), inset 0 2px 5px rgba(0, 0, 0, 0.35);
}

.link-btn {
  font: inherit;
  color: var(--link);
  background: none;
  border: 0;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

/* ===== 4. Sarlavha (header) ===== */
.site-header {
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  position: relative;
  z-index: 2;
}

.header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 68px;
  flex-wrap: wrap;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-law);
  font-weight: 600;
  font-size: 23px;
  color: #fff;
  text-decoration: none;
  letter-spacing: 0.01em;
}

/* Tarozi belgisi — muhr kabi oltin doira ichida */
.brand::before {
  content: "";
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23091731' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v15M8 19h8M5 7h14'/%3E%3Cpath d='M5 7l-2.6 5.5a2.6 2.6 0 0 0 5.2 0z'/%3E%3Cpath d='M19 7l-2.6 5.5a2.6 2.6 0 0 0 5.2 0z'/%3E%3C/svg%3E") center / 22px no-repeat,
    radial-gradient(circle at 35% 30%, var(--gold-face), var(--gold) 60%, var(--gold-ledge));
  box-shadow: 0 0 0 2px rgba(227, 181, 59, 0.35), 0 3px 8px rgba(0, 0, 0, 0.35);
}

.nav {
  display: flex;
  gap: 4px 6px;
  flex-wrap: wrap;
  font-size: 15px;
}

.nav a {
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
  padding: 7px 12px;
  border-radius: 10px;
}

.nav a:hover { color: #fff; background: rgba(255, 255, 255, 0.07); }

.nav a[aria-current="page"] {
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 -2px 0 var(--gold);
}

.nav a.nav-login {
  color: var(--navy-deep);
  font-weight: 700;
  background: linear-gradient(180deg, var(--gold-face), var(--gold));
  box-shadow: 0 3px 0 var(--gold-ledge);
  margin-left: 6px;
}

.nav a.nav-login:hover { color: var(--navy-deep); background: var(--gold-face); }

.nav a.nav-login[aria-current="page"] {
  color: var(--navy-deep);
  background: linear-gradient(180deg, var(--gold-face), var(--gold));
  box-shadow: 0 1px 0 var(--gold-ledge);
  transform: translateY(2px);
}

/* ===== 5. Bosh sahifa: savol va qidiruv (index.html) ===== */
/* .ask va .page-head — ekran kengligidagi to'q ko'k blok */
.ask,
.page-head {
  position: relative;
  isolation: isolate;
  color: #fff;
}

.ask::before,
.page-head::before {
  content: "";
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -1;
  border-bottom-left-radius: 28px;
  border-bottom-right-radius: 28px;
}

.ask { padding: 64px 0 52px; margin-bottom: 32px; }

.ask h1,
.page-head h1 {
  font-family: var(--font-law);
  font-weight: 600;
  font-size: clamp(34px, 6.5vw, 56px);
  line-height: 1.08;
  letter-spacing: -0.015em;
  margin: 0 0 14px;
  color: #fff;
  animation: rise 0.6s ease-out both;
}

.ask-lead {
  color: rgba(255, 255, 255, 0.74);
  font-size: 18px;
  margin: 0 0 28px;
  max-width: 34em;
}

.search {
  display: flex;
  gap: 10px;
  padding: 8px 8px 13px;
  background: var(--sheet);
  border-radius: 18px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.06);
  animation: rise 0.6s 0.1s ease-out both;
}

.search input {
  flex: 1;
  min-width: 0;
  border: 0;
  border-radius: 12px;
  background: var(--paper);
  color: var(--ink);
  font: inherit;
  font-size: 19px;
  padding: 14px 16px;
  box-shadow: inset 0 2px 4px rgba(14, 34, 64, 0.12);
}

.search input:focus { outline: 2px solid var(--gold); outline-offset: 0; }

.search button { padding: 0 28px; font-size: 17px; }

.examples {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 10px;
  margin-top: 22px;
}

.examples-label { color: rgba(255, 255, 255, 0.65); font-size: 15px; margin-right: 2px; }

@keyframes rise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}

/* ===== 6. Natijalar va kartochkalar ===== */
.results { padding-bottom: 8px; }

.results-count {
  color: var(--muted);
  font-size: 15px;
  font-weight: 500;
  margin: 0 0 14px;
}

.law,
.organ,
.admin-item {
  background: var(--sheet);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  border: 1px solid var(--line);
  padding: 22px 24px;
  margin-bottom: 14px;
}

.law { border-left: 5px solid var(--gold); }

.law h2 {
  font-family: var(--font-law);
  font-weight: 600;
  font-size: 23px;
  line-height: 1.25;
  margin: 0 0 4px;
}

.law h2 a { color: var(--ink); text-decoration: none; }
.law h2 a:hover { color: var(--link); text-decoration: underline; }

.law-meta { color: var(--muted); font-size: 14px; margin: 0 0 14px; }

.articles { list-style: none; margin: 0; padding: 0; }

.articles li {
  display: grid;
  grid-template-columns: 6.2em 1fr;
  gap: 14px;
  padding: 10px 0;
  border-top: 1px dashed var(--line);
}

/* Modda raqami — kichik muhr-yorliq */
.article-num,
.doc-num {
  display: inline-block;
  align-self: start;
  justify-self: start;
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 700;
  color: #6b4d00;
  background: var(--gold-tint);
  border: 1px solid rgba(160, 120, 18, 0.35);
  border-radius: 8px;
  padding: 3px 9px;
  margin-top: 3px;
}

@media (prefers-color-scheme: dark) {
  .article-num, .doc-num { color: var(--gold-face); }
}

.article-text {
  font-family: var(--font-law);
  font-size: 17px;
  line-height: 1.7;
}

.title-only { color: var(--muted); font-size: 15px; margin: 6px 0 0; }

.state {
  list-style: none;
  background: var(--sheet);
  border: 2px dashed var(--line);
  border-radius: var(--radius);
  padding: 26px 24px;
  color: var(--muted);
  margin-bottom: 14px;
}

.state strong { color: var(--ink); display: block; margin-bottom: 4px; font-size: 18px; }
.state.error { border-color: rgba(180, 35, 44, 0.4); }
.state.error strong { color: var(--danger); }

.hint {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 18px 0 56px;
  padding: 18px 22px;
  border-radius: var(--radius);
  background: linear-gradient(135deg, var(--gold-tint), var(--sheet));
  border: 1px solid rgba(160, 120, 18, 0.25);
  color: var(--ink);
}

.hint a { font-weight: 600; }

/* ===== 7. Pastki qism ===== */
.site-footer {
  background: var(--navy-deep);
  color: rgba(255, 255, 255, 0.62);
  padding: 26px 0 34px;
  font-size: 14px;
}

.site-footer a { color: var(--gold); }

/* ===== 8. Qonun sahifasi (law.html) ===== */
.back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 28px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
}

.back::before { content: "‹"; font-size: 22px; line-height: 1; }

.doc-head {
  padding: 18px 0 20px;
  border-bottom: 3px double var(--gold);
  margin-bottom: 4px;
}

.doc-head h1 {
  font-family: var(--font-law);
  font-weight: 600;
  font-size: clamp(30px, 5.5vw, 44px);
  line-height: 1.12;
  margin: 0 0 10px;
}

.doc-source { font-size: 15px; color: var(--muted); margin: 0; overflow-wrap: anywhere; }

.doc-filter {
  margin: 24px 0 18px;
  padding: 18px 20px;
  background: var(--sheet);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.doc-filter label { display: block; font-weight: 600; font-size: 15px; margin-bottom: 8px; }

.doc-filter input,
.page-filter {
  width: 100%;
  font: inherit;
  color: var(--ink);
  background: var(--paper);
  border: 0;
  border-radius: 12px;
  padding: 12px 14px;
  box-shadow: inset 0 2px 4px rgba(14, 34, 64, 0.12);
}

.doc-filter input:focus,
.page-filter:focus { outline: 2px solid var(--gold); outline-offset: 0; }

.filter-info { margin: 8px 0 0; font-size: 14px; color: var(--muted); }

.doc-articles { list-style: none; margin: 0; padding: 0 0 48px; }

.doc-articles li {
  background: var(--sheet);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 20px 24px;
  margin-bottom: 12px;
  scroll-margin-top: 24px;
}

.doc-num { margin: 0 0 10px; }

.doc-text {
  font-family: var(--font-law);
  font-size: 18px;
  line-height: 1.75;
  margin: 0;
  max-width: 38em;
  white-space: pre-line; /* moddadagi qator ko'chishlari saqlanadi */
}

/* ===== 9. Ro'yxat sahifalari (organs.html, advokats.html) ===== */
.page-head { padding: 56px 0 44px; margin-bottom: 28px; }

.page-head .ask-lead { margin-bottom: 24px; }

.page-head .page-filter {
  background: var(--sheet);
  font-size: 18px;
  padding: 15px 16px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.3), inset 0 2px 4px rgba(14, 34, 64, 0.1);
}

.page-head .filter-info { color: rgba(255, 255, 255, 0.7); margin-top: 12px; }

#specs { margin-top: 18px; }

.organs { list-style: none; margin: 0; padding: 0; }

.organ h2 {
  font-family: var(--font-law);
  font-weight: 600;
  font-size: 22px;
  line-height: 1.25;
  margin: 0 0 8px;
}

.organ-when { margin: 0; max-width: 40em; }

.organ-label { color: var(--muted); }

.organ-link {
  display: inline-block;
  margin-top: 12px;
  font-size: 15px;
  font-weight: 600;
}

/* Advokat kartochkasi */
.advokat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.advokat-main { flex: 1; min-width: 0; }

.advokat-spec {
  display: inline-block;
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--link);
  background: rgba(29, 91, 191, 0.08);
  border-radius: 8px;
  padding: 3px 10px;
}

.call-btn {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 11px 18px;
  border-radius: 12px;
  color: var(--navy-deep);
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  background: linear-gradient(180deg, var(--gold-face), var(--gold));
  box-shadow:
    0 5px 0 var(--gold-ledge),
    0 10px 18px rgba(9, 23, 49, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.55);
  transition: transform 0.08s ease, box-shadow 0.08s ease;
}

.call-btn span { font-weight: 500; font-size: 13px; opacity: 0.75; }

.call-btn:hover { transform: translateY(-1px); }

.call-btn:active {
  transform: translateY(5px);
  box-shadow: 0 0 0 var(--gold-ledge), 0 3px 6px rgba(9, 23, 49, 0.25);
}

/* ===== 10. Formalar (login.html, admin.html) ===== */
.auth { max-width: 480px; }

.auth-box {
  margin: 44px 0 64px;
  padding: 30px 28px 32px;
  background: var(--sheet);
  border: 1px solid var(--line);
  border-top: 5px solid var(--gold);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.auth-box h1 {
  font-family: var(--font-law);
  font-weight: 600;
  font-size: clamp(28px, 5vw, 34px);
  line-height: 1.15;
  margin: 0 0 18px;
}

.auth-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; }

.form { display: flex; flex-direction: column; gap: 16px; }

.form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-weight: 600;
  font-size: 15px;
}

.label-hint { font-weight: 400; color: var(--muted); margin-top: -4px; }

.form input,
.form select,
.form textarea {
  font: inherit;
  font-weight: 400;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 12px 14px;
  width: 100%;
  box-shadow: inset 0 2px 4px rgba(14, 34, 64, 0.1);
}

.form textarea { min-height: 130px; resize: vertical; line-height: 1.55; }

.form input:focus,
.form select:focus,
.form textarea:focus { outline: 2px solid var(--gold); outline-offset: 0; }

.form-error { color: var(--danger); margin: 0; min-height: 1.5em; font-size: 15px; font-weight: 500; }

.form .btn { margin-bottom: 6px; }

.profile-name { font-size: 22px; font-weight: 700; margin: 0; }

.auth-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 24px; padding-bottom: 6px; }

/* ===== 11. Admin panel (admin.html) ===== */
main.wrap.admin { max-width: 960px; }

.admin-title {
  font-family: var(--font-law);
  font-weight: 600;
  font-size: clamp(30px, 5vw, 40px);
  margin: 40px 0 20px;
}

.admin-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px 20px;
  padding: 6px 0 16px;
}

.admin-head .link-btn { flex-basis: 100%; text-align: left; }

.admin-head h2 {
  font-family: var(--font-law);
  font-weight: 600;
  font-size: 27px;
  line-height: 1.2;
  margin: 0;
}

.admin-head .filter-info { margin: 0 0 2px; }

.flash { min-height: 1.5em; margin: 0 0 10px; color: #1d7a43; font-weight: 600; font-size: 15px; }
.flash.flash-error { color: var(--danger); }

@media (prefers-color-scheme: dark) {
  .flash { color: #6fd39a; }
}

.admin-form {
  background: var(--sheet);
  border: 1px solid var(--line);
  border-top: 5px solid var(--gold);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 22px 24px 26px;
  margin-bottom: 24px;
  scroll-margin-top: 16px;
}

.admin-form h3 { margin: 0; font-size: 20px; }

.admin-list { list-style: none; margin: 0; padding: 0 0 56px; }

.admin-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px 20px;
}

.admin-item-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.admin-item-main .filter-info { margin: 0; }

.admin-item-actions { display: flex; gap: 10px; flex-shrink: 0; }

/* ===== 12. Telefon ekrani ===== */
@media (max-width: 640px) {
  .header-row { padding-top: 12px; padding-bottom: 12px; gap: 10px; }
  .nav { font-size: 14px; gap: 6px 2px; }
  .nav a { padding: 6px 9px; }

  .ask { padding: 40px 0 36px; }
  .page-head { padding: 40px 0 32px; }
  .ask::before, .page-head::before { border-radius: 0 0 20px 20px; }

  .search { flex-direction: column; }
  .search button { padding: 14px; }

  .law, .organ, .admin-item, .doc-articles li { padding: 18px; }
  .articles li { grid-template-columns: 1fr; gap: 6px; }

  .advokat { flex-direction: column; align-items: stretch; gap: 14px; }

  .admin-item { flex-direction: column; align-items: stretch; }
  .admin-item-actions { flex-wrap: wrap; }

  .auth-box { padding: 24px 18px 26px; margin-top: 28px; }
}

/* Harakatni kamaytirish so'ralgan bo'lsa */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}

/* ===== 13. AI yordamchi (yordamchi.html) ===== */
.ask-box {
  background: var(--sheet);
  border-radius: 18px;
  padding: 10px 10px 14px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.06);
}

.ask-box textarea {
  display: block;
  width: 100%;
  min-height: 120px;
  resize: vertical;
  font: inherit;
  font-size: 18px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--paper);
  border: 0;
  border-radius: 12px;
  padding: 14px 16px;
  box-shadow: inset 0 2px 4px rgba(14, 34, 64, 0.12);
}

.ask-box textarea:focus { outline: 2px solid var(--gold); outline-offset: 0; }

.ask-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
}

.mic-container {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.mic-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--danger);
  flex-shrink: 0;
}

.mic-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s ease;
}

.mic-btn[aria-pressed="true"] {
  border-color: #ef4444;
  background: rgba(239, 68, 68, 0.08);
  color: #b91c1c;
}

.mic-btn[aria-pressed="true"] .mic-dot { animation: pulse 1s ease-in-out infinite; }

.mic-timer {
  font-variant-numeric: tabular-nums;
  font-size: 13px;
  font-weight: 600;
  color: #b91c1c;
}

.mic-visualizer {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 22px;
  padding: 0 4px;
}

.mic-visualizer .v-bar {
  display: inline-block;
  width: 3.5px;
  height: 4px;
  background: #ef4444;
  border-radius: 2px;
  transition: height 0.06s ease;
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(1.4); }
}

.mic-status { margin: 10px 4px 0; min-height: 1.3em; font-size: 14px; color: var(--muted); }

.state.thinking { border-style: solid; border-color: var(--gold); }

.answer {
  background: var(--sheet);
  border: 1px solid var(--line);
  border-left: 6px solid #1d7a43;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px 26px 28px;
  margin-bottom: 20px;
  scroll-margin-top: 16px;
}

.answer.answer-unsure { border-left-color: var(--gold); }

.answer-label {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 700;
  color: #1d7a43;
}

.answer-unsure .answer-label { color: #8a6400; }

@media (prefers-color-scheme: dark) {
  .answer-label { color: #6fd39a; }
  .answer-unsure .answer-label { color: var(--gold-face); }
}

.answer-summary {
  font-family: var(--font-law);
  font-weight: 600;
  font-size: clamp(22px, 4vw, 28px);
  line-height: 1.25;
  margin: 0 0 18px;
}

.answer h3 { font-size: 17px; margin: 20px 0 8px; }

.answer-text { margin: 0; max-width: 40em; }

.answer-steps { margin: 0; padding-left: 22px; }
.answer-steps li { margin-bottom: 6px; }

.answer .btn { margin-top: 20px; }

.cite {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: #6b4d00;
  background: var(--gold-tint);
  border: 1px solid rgba(160, 120, 18, 0.35);
  border-radius: 6px;
  padding: 0 6px;
  margin: 0 2px;
  text-decoration: none;
  vertical-align: 2px;
}

@media (prefers-color-scheme: dark) {
  .cite { color: var(--gold-face); }
}

.sources h3 { margin: 8px 0 2px; }
.sources .filter-info { margin: 0 0 12px; }

.source {
  background: var(--sheet);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px 22px;
  margin-bottom: 12px;
  scroll-margin-top: 16px;
}

.source:target { outline: 3px solid var(--gold); }

.source-head { font-size: 15px; font-weight: 600; margin-bottom: 8px; }

.disclaimer { color: var(--muted); font-size: 14px; margin: 24px 0 56px; }

@media (max-width: 640px) {
  .ask-actions { flex-direction: column-reverse; }
  .answer { padding: 20px 18px 22px; }
}

/* ===== 14. Import (admin.html) ===== */
.imp-list { counter-reset: none; padding-left: 0; }
.imp-list .admin-item { padding: 12px 18px; margin-bottom: 8px; box-shadow: none; }
.admin-form select {
  font: inherit;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 12px 14px;
  width: 100%;
}


/* ===== ADVOKAT NEO: zamonaviy, chuqurlik hissi beruvchi qatlam ===== */
:root {
  color-scheme: light;
  --navy: #101b3c;
  --navy-deep: #080f25;
  --navy-soft: #24396d;
  --gold: #dfb85a;
  --gold-face: #f8d989;
  --gold-ledge: #a77a27;
  --gold-tint: #fff5d9;
  --paper: #f3f5fa;
  --sheet: #fff;
  --ink: #151d35;
  --muted: #6c7590;
  --line: #e4e8f1;
  --link: #5144c8;
  --shadow: 0 12px 35px rgba(18, 27, 60, .09), 0 2px 8px rgba(18, 27, 60, .04);
  --radius: 20px;
}
body { background: radial-gradient(ellipse at 50% 0%, #fff 0, #f5f6fb 44rem, #eff2f8 100%); }
.site-header {
  background: rgba(8, 15, 37, .94);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 8px 32px rgba(7,13,34,.16);
}
.header-row { max-width: 1180px; min-height: 76px; }
.brand { font-family: var(--font-ui); font-size: 21px; letter-spacing: -.04em; }
.brand::before { width: 40px; height: 40px; box-shadow: 0 0 0 5px rgba(223,184,90,.12), 0 8px 22px rgba(223,184,90,.25); }
.nav a { transition: color .2s, background .2s, transform .2s; }
.nav a:hover { transform: translateY(-1px); }
.wrap { max-width: 1120px; }
.ask::before,.page-head::before {
  background:
    radial-gradient(ellipse at 80% 10%, rgba(125,105,255,.32), transparent 37%),
    radial-gradient(ellipse at 12% 95%, rgba(43,169,189,.17), transparent 34%),
    repeating-radial-gradient(circle at 86% -30%, transparent 0 17px, rgba(255,255,255,.035) 17px 18px),
    linear-gradient(128deg,#0c1534 0%,#151f49 52%,#24376a 100%);
  border-radius: 0 0 36px 36px;
  box-shadow: 0 22px 60px rgba(14,23,57,.17);
}
.ask { padding: clamp(58px, 9vw, 104px) 0 66px; margin-bottom: 38px; }
.ask h1,.page-head h1 { max-width: 780px; font-family: var(--font-ui); font-weight: 700; font-size: clamp(42px,7vw,76px); letter-spacing: -.065em; line-height: 1.01; }
.ask h1::after { content: ""; display: block; width: 76px; height: 4px; border-radius: 9px; margin-top: 22px; background: linear-gradient(90deg,var(--gold-face),rgba(248,217,137,0)); }
.ask-lead { max-width: 630px; font-size: clamp(16px,2vw,19px); line-height: 1.7; }
.search,.ask-box { position: relative; padding: 10px; border-radius: 22px; background: rgba(255,255,255,.97); box-shadow: 0 24px 65px rgba(4,9,28,.32), 0 0 0 1px rgba(255,255,255,.22), inset 0 1px 0 #fff; }
.search { max-width: 850px; }
.search input { background:#f4f5fa; box-shadow: inset 0 1px 3px rgba(22,30,65,.06); }
.search button,.btn,.call-btn { border-radius: 14px; background: linear-gradient(145deg,#ffe8a9 0%,#e4bd63 65%,#c79739 100%); box-shadow: 0 5px 0 #96712c, 0 13px 24px rgba(5,11,30,.2), inset 0 1px 0 rgba(255,255,255,.85); transition: transform .22s, box-shadow .22s, filter .22s; }
.search button:hover,.btn:hover,.call-btn:hover { transform: translateY(-3px); box-shadow: 0 7px 0 #96712c, 0 17px 30px rgba(5,11,30,.24), inset 0 1px 0 #fff; }
.search button:active,.btn:active,.call-btn:active { transform: translateY(3px); }
.example { border: 1px solid rgba(255,255,255,.26); background: rgba(255,255,255,.10); color: rgba(255,255,255,.92); box-shadow: inset 0 1px rgba(255,255,255,.17), 0 5px 14px rgba(3,9,28,.12); backdrop-filter: blur(10px); transition: transform .2s, background .2s; }
.example:hover { transform: translateY(-2px); background: rgba(255,255,255,.2); }
.example:active { transform: translateY(1px); }
.law,.organ,.admin-item,.doc-articles li,.source,.answer,.auth-box,.doc-filter,.admin-form {
  border: 1px solid rgba(225,230,241,.92); border-radius: 20px; box-shadow: var(--shadow); transition: transform .24s ease, box-shadow .24s ease;
}
.law:hover,.organ:hover,.doc-articles li:hover,.source:hover { transform: translateY(-3px); box-shadow: 0 20px 44px rgba(18,27,60,.12),0 3px 10px rgba(18,27,60,.05); }
.law { border-left: 4px solid var(--gold); }
.article-num,.doc-num,.cite { color:#4938ae; background:#f0edff; border:1px solid #e0dafd; }
.hint { border-radius: 18px; background: linear-gradient(125deg,#fff7e2,#fff); border:1px solid #f1dfb1; box-shadow: 0 8px 24px rgba(59,45,12,.05); }
.site-footer { margin-top: 18px; background: linear-gradient(115deg,#080f25,#121d40); }
.auth-box { border-top: 0; position: relative; overflow: hidden; }
.auth-box::before { content:""; position:absolute; height:4px; left:0; right:0; top:0; background:linear-gradient(90deg,#6d5ce7,#52c8cf,#f0ca73); }
.ask::after,.page-head::after { content:"✦"; position:absolute; z-index:-1; right: max(calc((100vw - 1120px)/2), 5vw); top: 82px; width: clamp(110px,18vw,220px); aspect-ratio:1; display:grid; place-items:center; border-radius:48% 52% 58% 42%; color:rgba(255,228,164,.88); font-size:clamp(52px,9vw,104px); background:radial-gradient(circle at 35% 26%,rgba(255,255,255,.28),rgba(255,255,255,.05) 27%,rgba(93,112,204,.18) 53%,rgba(132,151,255,.12)); border:1px solid rgba(255,255,255,.2); box-shadow:inset 0 1px rgba(255,255,255,.38),0 30px 75px rgba(3,8,31,.26); transform:rotate(-12deg); animation:float-seal 7s ease-in-out infinite; }
@keyframes float-seal { 0%,100%{transform:translateY(0) rotate(-12deg)} 50%{transform:translateY(-12px) rotate(-7deg)} }
/* Sahifa ochilishidagi qisqa, o‘tkazib yuboriladigan brend intro */
.opening { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; color:#fff; background:radial-gradient(ellipse at 50% 48%,#263c76 0,#111b40 38%,#080f25 78%); animation:opening-out .7s 1.65s cubic-bezier(.7,0,.2,1) forwards; pointer-events:none; }
.opening-inner { text-align:center; animation:opening-in .75s cubic-bezier(.18,.8,.25,1) both; }
.opening-mark { width:84px;height:84px;margin:0 auto 20px;display:grid;place-items:center;border-radius:27px;color:#152044;font-size:40px;background:linear-gradient(145deg,#fff0c0,#d8ad4c);box-shadow:0 12px 0 #98732e,0 28px 70px rgba(0,0,0,.4),inset 0 2px 0 #fff;transform:rotate(-7deg);animation:seal-pop .8s .12s cubic-bezier(.2,1.6,.4,1) both;}
.opening-title { margin:0;font:700 32px var(--font-ui);letter-spacing:-.06em; }
.opening-caption { margin:8px 0 0;color:rgba(255,255,255,.64);font-size:13px;letter-spacing:.18em;text-transform:uppercase; }
.opening-bar { width:125px;height:2px;margin:24px auto 0;overflow:hidden;background:rgba(255,255,255,.18);border-radius:8px; }
.opening-bar::after { content:"";display:block;width:42%;height:100%;background:#f1cf7c;animation:loading-glide 1.15s ease-in-out infinite; }
@keyframes opening-out { to { opacity:0; visibility:hidden; } }
@keyframes opening-in { from { opacity:0; transform:translateY(16px) scale(.96); } to { opacity:1; transform:none; } }
@keyframes seal-pop { from { opacity:0;transform:rotate(-18deg) scale(.55); } to { opacity:1;transform:rotate(-7deg) scale(1); } }
@keyframes loading-glide { from { transform:translateX(-110%); } to { transform:translateX(260%); } }
@media(max-width:760px) { .ask::after,.page-head::after { right:7vw;top:30px;width:82px;font-size:40px;opacity:.6; } .ask h1,.page-head h1 { max-width:85%; } .header-row { justify-content:center; } .nav { justify-content:center; } }
@media(max-width:480px) { .ask h1,.page-head h1 { font-size:42px; } .search { gap:8px; } .ask::after,.page-head::after { width:60px;top:20px; } }
@media(prefers-reduced-motion:reduce) { .opening { animation-duration:.01ms; animation-delay:.01ms; } .opening-inner,.opening-mark,.opening-bar::after,.ask::after,.page-head::after { animation:none!important; } }
.opening-skip { pointer-events:auto; position:absolute; top:calc(100% + 54px); left:50%; transform:translateX(-50%); border:1px solid rgba(255,255,255,.25); border-radius:999px; padding:8px 16px; color:rgba(255,255,255,.8); background:rgba(255,255,255,.08); font:500 13px var(--font-ui); cursor:pointer; }
.opening-skip:hover { background:rgba(255,255,255,.16); }
.opening.opening-dismissed { animation:opening-out .4s ease forwards; }


/* ===== FUTURE FRIENDLY: midnight glass + warm 3D ===== */
:root {
  color-scheme: dark;
  --navy:#0b1230; --navy-deep:#080d22; --navy-soft:#202b57;
  --gold:#f0c574; --gold-face:#ffe4a9; --gold-ledge:#a97839;
  --gold-tint:rgba(255,210,145,.12);
  --paper:#0b1027; --sheet:rgba(22,30,62,.82); --ink:#f4f5ff;
  --muted:#a6afcb; --line:rgba(205,216,255,.14); --link:#83e8ea;
  --mark:rgba(247,195,125,.24); --danger:#ff8c9c; --ledge-light:#252d4d;
  --shadow:0 18px 48px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.04);
  --radius:20px;
}
html { scroll-behavior:smooth; }
body {
  color:var(--ink);
  background:radial-gradient(ellipse at 74% 8%,rgba(74,70,166,.14),transparent 35rem),radial-gradient(ellipse at 7% 58%,rgba(42,154,174,.07),transparent 30rem),linear-gradient(145deg,#0b1027,#0d1430 52%,#0a1026);
}
.site-header { background:rgba(8,13,34,.78); backdrop-filter:blur(20px); border-bottom:1px solid rgba(220,229,255,.1); box-shadow:0 8px 40px rgba(0,0,0,.16); }
.header-row { max-width:1200px; min-height:78px; }
.brand { font:700 21px var(--font-ui); letter-spacing:-.05em; }
.brand::before { background-color:#dcd8ff; box-shadow:0 0 24px rgba(136,124,255,.34); }
.nav a { color:rgba(236,240,255,.72); transition:background .2s,color .2s,transform .2s; }
.nav a:hover { color:#fff; background:rgba(255,255,255,.08); transform:translateY(-1px); }
.nav a[aria-current="page"] { color:#fff; background:rgba(137,133,255,.12); box-shadow:inset 0 -2px #a89bff; }
.nav a.nav-login,.nav a.nav-login[aria-current="page"] { color:#0c1532; background:linear-gradient(135deg,#ffe2aa,#ff9a88); box-shadow:0 4px 18px rgba(255,150,132,.18),inset 0 1px #fff; }
.wrap { max-width:1200px; }
.ask::before,.page-head::before {
  background:radial-gradient(ellipse at 77% 36%,rgba(104,91,232,.28),transparent 42%),radial-gradient(ellipse at 86% 87%,rgba(50,199,211,.12),transparent 37%),linear-gradient(120deg,#11183b 0%,#171b45 56%,#1b2850 100%);
  border:1px solid rgba(207,219,255,.13); border-radius:0 0 36px 36px; box-shadow:0 28px 80px rgba(0,0,0,.2);
}
.ask h1,.page-head h1 { font-family:var(--font-ui); font-weight:700; letter-spacing:-.055em; }
.ask-lead { color:rgba(237,240,255,.72); }
.btn,.search button,.call-btn { color:#111633; border-radius:14px; background:linear-gradient(140deg,#ffe1ac,#ffab91 78%,#fb8c9a); box-shadow:0 5px 0 #a65d63,0 13px 28px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.9); transition:transform .2s,box-shadow .2s,filter .2s; }
.btn:hover,.search button:hover,.call-btn:hover { filter:brightness(1.05); transform:translateY(-2px); box-shadow:0 7px 0 #a65d63,0 18px 34px rgba(0,0,0,.3),inset 0 1px #fff; }
.btn:active,.search button:active,.call-btn:active { transform:translateY(3px); }
.btn-quiet,.btn-danger { color:#f2f3ff; background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.04)); box-shadow:0 4px 0 rgba(3,7,22,.45),inset 0 1px rgba(255,255,255,.13); }
.btn-quiet:hover { box-shadow:0 6px 0 rgba(3,7,22,.45),inset 0 1px rgba(255,255,255,.17); }
.search,.ask-box { background:rgba(27,35,70,.72); border:1px solid rgba(224,232,255,.23); box-shadow:0 24px 65px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.13); backdrop-filter:blur(18px); }
.search input,.ask-box textarea,.doc-filter input,.page-filter,.form input,.form select,.form textarea,.admin-form select { color:var(--ink); background:rgba(8,14,35,.76); border:1px solid rgba(216,225,255,.1); box-shadow:inset 0 2px 8px rgba(0,0,0,.18); }
.search input::placeholder,.ask-box textarea::placeholder,.form input::placeholder { color:#8d98b7; }
.search input:focus,.ask-box textarea:focus,.doc-filter input:focus,.page-filter:focus,.form input:focus,.form select:focus,.form textarea:focus { outline:2px solid #7be1e5; }
.example { color:rgba(242,244,255,.92); background:rgba(255,255,255,.07); border:1px solid rgba(223,230,255,.16); box-shadow:inset 0 1px rgba(255,255,255,.1),0 7px 18px rgba(0,0,0,.12); backdrop-filter:blur(12px); }
.example:hover { background:rgba(255,255,255,.13); }
.example[aria-pressed="true"] { color:#fff; background:linear-gradient(135deg,rgba(130,112,255,.48),rgba(52,195,209,.32)); box-shadow:inset 0 1px rgba(255,255,255,.2); }
.law,.organ,.admin-item,.doc-articles li,.source,.answer,.auth-box,.doc-filter,.admin-form,.service-card { color:var(--ink); background:linear-gradient(145deg,rgba(27,37,76,.88),rgba(17,25,54,.9)); border:1px solid rgba(219,227,255,.13); box-shadow:var(--shadow); }
.law:hover,.organ:hover,.doc-articles li:hover,.source:hover,.service-card:hover { transform:translateY(-3px); border-color:rgba(151,168,255,.36); box-shadow:0 23px 52px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.08); }
.law h2 a { color:var(--ink); }
.article-num,.doc-num,.cite,.advokat-spec { color:#dbd2ff; background:rgba(133,117,255,.14); border-color:rgba(168,150,255,.24); }
.articles li { border-top-color:rgba(217,227,255,.13); }
.hint { color:var(--ink); background:linear-gradient(130deg,rgba(37,42,84,.8),rgba(29,37,70,.8)); border:1px solid rgba(225,196,150,.17); box-shadow:var(--shadow); }
.hint a,.back,.organ-link,.answer a { color:#89e3eb; }
.site-footer { background:rgba(7,11,28,.72); border-top:1px solid rgba(217,225,255,.1); color:rgba(230,235,255,.58); }
.site-footer a { color:#ffcd9d; }
.auth-box::before { background:linear-gradient(90deg,#8377ff,#55d2dc,#ffa18d); }
.form label,.admin-form h3,.admin-head h2,.admin-title { color:var(--ink); }
.form-error { color:#ff9ba9; }
.state { color:var(--muted); background:rgba(22,30,62,.78); border-color:rgba(211,222,255,.2); }
.state strong { color:var(--ink); }
.state.error { border-color:rgba(255,140,156,.45); }
.page-head .filter-info,.examples-label { color:rgba(234,239,255,.62); }
.disclaimer,.filter-info,.law-meta,.title-only { color:var(--muted); }
.doc-head { border-bottom-color:rgba(255,205,157,.55); }
.flash { color:#71dbab; }
.flash.flash-error { color:#ff9ba9; }
.answer { border-left-color:#51d7c3; }
.answer.answer-unsure { border-left-color:#f4c36f; }
.answer-label { color:#7ae4c8; }
.answer-unsure .answer-label { color:#ffd58a; }
.source:target { outline:3px solid #7de0e6; }
.mark,mark { background:rgba(250,195,122,.35); color:#fff3dd; }
@media(prefers-color-scheme:dark) { .article-num,.doc-num,.cite { color:#dbd2ff; } .flash { color:#71dbab; } .answer-label { color:#7ae4c8; } .answer-unsure .answer-label { color:#ffd58a; } }
/* Bosh sahifa — futuristik chuqurlik + iliq, do‘stona detal */
.home-page main.wrap { max-width:1200px; }
.home-hero { padding:72px 0 48px; margin-bottom:0; }
.home-hero::after { content:none; }
.home-hero::before { inset:0 calc(50% - 50vw); border-radius:0 0 42px 42px; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr); align-items:center; gap:20px; min-height:480px; }
.hero-copy { position:relative; z-index:1; max-width:690px; }
.hero-eyebrow,.section-kicker { display:flex; align-items:center; gap:9px; color:#b9b9ef; font-size:11px; font-weight:700; letter-spacing:.18em; margin:0 0 20px; }
.status-dot { width:8px;height:8px;border-radius:50%; background:#6ee3d2; box-shadow:0 0 13px #6ee3d2; }
.home-hero h1 { margin:0 0 18px; font-size:clamp(44px,6.2vw,76px); line-height:1.02; letter-spacing:-.065em; }
.home-hero h1 span { color:transparent; background:linear-gradient(95deg,#ffc98f 8%,#ff9d9c 52%,#c3b5ff 100%); background-clip:text; -webkit-background-clip:text; }
.home-hero .ask-lead { max-width:550px; margin:0 0 28px; font-size:17px; }
.home-hero .search { padding:8px; gap:9px; max-width:700px; border-radius:18px; }
.home-hero .search input { min-width:0; background:transparent; border:0; box-shadow:none; padding:13px 6px; font-size:16px; }
.search-symbol { display:grid; place-items:center; flex:0 0 40px; color:#92def0; font-size:39px; line-height:1; transform:rotate(-15deg); }
.home-hero .search button { padding:12px 20px; white-space:nowrap; }
.home-hero .examples { gap:9px; margin-top:16px; }
.home-hero .examples-label { font-size:12px; }
.home-hero .example { padding:7px 13px; font-size:13px; }
.hero-trust { display:flex; align-items:center; gap:9px; color:rgba(228,234,255,.6); margin-top:25px; font-size:12px; }
.hero-trust span { color:#ffce98; font-size:16px; }
.hero-trust i { display:inline-block; width:3px;height:3px; border-radius:50%; background:rgba(255,255,255,.4); margin:0 5px; }
.hero-art { position:relative; isolation:isolate; display:grid; place-items:center; min-height:430px; margin:0; }
.hero-art img { position:relative; z-index:2; width:min(112%,620px); height:auto; filter:drop-shadow(0 26px 50px rgba(0,0,0,.25)); animation:art-float 7s ease-in-out infinite; }
.art-glow { position:absolute; z-index:-2; width:78%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(105,111,255,.3),rgba(77,206,221,.12) 38%,transparent 70%); filter:blur(18px); }
.art-orbit { position:absolute; z-index:-1; border:1px solid rgba(169,189,255,.19); border-radius:50%; transform:rotate(-24deg); }
.orbit-one { width:91%;height:56%; box-shadow:0 0 40px rgba(109,122,255,.08); }
.orbit-two { width:72%;height:93%; transform:rotate(31deg); border-color:rgba(107,219,224,.15); }
.art-note { position:absolute; z-index:3; right:-5px; bottom:25px; display:flex; align-items:center; gap:11px; max-width:250px; padding:12px 17px 12px 12px; border-radius:15px; background:rgba(21,29,62,.76); border:1px solid rgba(232,235,255,.19); box-shadow:0 14px 35px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.12); backdrop-filter:blur(16px); }
.note-icon { display:grid;place-items:center;width:34px;height:34px;border-radius:11px;color:#301f48;background:linear-gradient(145deg,#ffe1b2,#ff9e91); }
.art-note strong,.art-note small { display:block; }
.art-note strong { font-size:12px; }
.art-note small { margin-top:3px;color:#adb6d3;font-size:10px; }
.art-pill { position:absolute; z-index:3; left:0; top:48px; padding:8px 11px; border:1px solid rgba(152,166,255,.24); border-radius:999px; color:#d4d5ff; background:rgba(32,39,84,.7); font-size:9px; letter-spacing:.16em; backdrop-filter:blur(12px); }
@keyframes art-float { 0%,100% { transform:translateY(0) rotate(-1deg); } 50% { transform:translateY(-9px) rotate(1deg); } }
.service-section { position:relative; z-index:2; padding:34px 0 25px; }
.section-heading { display:flex; align-items:center; gap:13px; margin-bottom:15px; color:rgba(231,235,255,.8); font-size:14px; }
.section-heading .section-kicker { margin:0; font-size:10px; color:#a9a8e6; }
.service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.service-card { display:flex; align-items:center; gap:13px; min-width:0; padding:16px; border-radius:17px; text-decoration:none; backdrop-filter:blur(16px); transition:transform .22s,border-color .22s,box-shadow .22s; }
.service-icon { display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border:1px solid rgba(136,165,255,.2);border-radius:14px;color:#aeb0ff;background:linear-gradient(145deg,rgba(126,117,255,.24),rgba(54,196,215,.1));font-size:26px;box-shadow:inset 0 1px rgba(255,255,255,.16),0 7px 18px rgba(0,0,0,.16); }
.service-ai .service-icon { color:#ffc0a0;background:linear-gradient(145deg,rgba(255,170,141,.2),rgba(152,116,255,.15)); }
.service-lawyer .service-icon { color:#79e2df;background:linear-gradient(145deg,rgba(66,218,210,.18),rgba(104,123,255,.15)); }
.service-text { min-width:0; flex:1; }
.service-text strong,.service-text small { display:block; }
.service-text strong { color:#f3f3ff; font-size:14px; }
.service-text small { margin-top:3px; color:#a5aec9; font-size:11px; line-height:1.45; }
.service-arrow { color:#8e94c7; font-size:18px; }
.service-card:hover { transform:translateY(-3px); background:linear-gradient(145deg,rgba(40,50,96,.94),rgba(24,34,73,.94)); }
.footer-row { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.footer-row>span:first-child { color:#e7e9ff; font-weight:700; letter-spacing:.1em; }
.footer-accent { color:#ffa990; }
.footer-row small { display:block; margin-top:2px; color:#8791b3; font-size:8px; font-weight:500; letter-spacing:.17em; }
.footer-row>span:last-child { font-size:12px; }
.results:empty { display:none; }
@media(max-width:850px) {
 .hero-grid { grid-template-columns:1fr minmax(240px,.76fr); gap:0; min-height:420px; }
 .hero-art { min-height:350px; }
 .hero-art img { width:125%; max-width:none; }
 .home-hero h1 { font-size:clamp(43px,6.4vw,61px); }
 .home-hero .search button { padding:11px 14px; }
 .service-grid { gap:9px; }
 .service-card { padding:13px 11px; gap:9px; }
 .service-icon { flex-basis:39px;width:39px;height:39px; }
}
@media(max-width:640px) {
 .header-row { padding:12px 16px; }
 .nav { gap:4px; }
 .nav a { padding:6px 8px;font-size:12px; }
 .home-hero { padding:46px 0 32px; }
 .home-hero::before { border-radius:0 0 26px 26px; }
 .hero-grid { grid-template-columns:1fr; gap:0; }
 .hero-copy { max-width:none; }
 .home-hero h1 { max-width:none;font-size:clamp(44px,11vw,62px); }
 .home-hero .ask-lead { max-width:500px;font-size:15px; }
 .hero-art { min-height:220px; margin:-6px auto 0; width:min(100%,420px); }
 .hero-art img { width:100%; }
 .orbit-one { width:82%;height:55%; }
 .orbit-two { width:62%;height:84%; }
 .art-pill { left:1%; top:12px; }
 .art-note { right:0; bottom:0; }
 .hero-trust { flex-wrap:wrap; margin-top:18px; }
 .service-section { padding:25px 0 16px; }
 .service-grid { grid-template-columns:1fr; }
 .service-card { padding:12px 14px; }
 .service-icon { flex-basis:42px;width:42px;height:42px; }
 .footer-row { align-items:flex-start; flex-direction:column; }
 .search-symbol { flex-basis:31px; }
 .home-hero .search { gap:3px; }
 .home-hero .search input { font-size:14px; }
 .home-hero .search button { padding:10px 11px;font-size:13px; }
}
@media(max-width:390px) { .nav a { padding:5px 6px;font-size:11px; } .home-hero .examples { gap:6px; } .home-hero .example { padding:6px 9px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .hero-art img { animation:none; } }

/* ===== Legal Chain & Court Templates Box Styles ===== */
.advokat-box {
  margin: 18px 0;
  padding: 16px 20px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(14, 21, 48, 0.6);
  backdrop-filter: blur(8px);
}
.advokat-box h3 {
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
}
.clarifications-box {
  border-left: 4px solid #8575ff;
  background: linear-gradient(135deg, rgba(133, 117, 255, 0.08), rgba(20, 28, 64, 0.7));
}
.clarifications-box h3 {
  color: #c9c2ff;
}
.clarification-hint {
  font-size: 13px;
  color: var(--muted);
  margin: 0 0 10px;
}
.clarifications-box ul {
  margin: 0;
  padding-left: 20px;
}
.clarifications-box li {
  margin-bottom: 6px;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.5;
}
.deadline-box {
  border-left: 4px solid #ffaa5b;
  background: linear-gradient(135deg, rgba(255, 170, 91, 0.1), rgba(28, 22, 50, 0.7));
  color: #ffe6c7;
  font-size: 14px;
  line-height: 1.55;
}
.deadline-box strong {
  color: #ffc27d;
}
.template-box {
  border-left: 4px solid #4ee0cf;
  background: linear-gradient(135deg, rgba(78, 224, 207, 0.08), rgba(15, 30, 60, 0.75));
}
.template-box h3 {
  color: #79f0e1;
}
.template-title {
  margin: 4px 0 8px;
  font-size: 15px;
  color: #ffffff;
}
.template-meta {
  margin: 3px 0;
  font-size: 13px;
  color: var(--muted);
}
.template-meta em {
  font-style: normal;
  color: #b0bcd9;
}
.template-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}
.sample-text-wrap {
  margin-top: 14px;
  padding: 12px;
  border-radius: 10px;
  background: rgba(7, 11, 28, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.1);
  overflow-x: auto;
}
.sample-code {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-word;
  color: #e2e8f8;
}

/* ===== AI Advokat Multi-turn Chat Styles ===== */
.chat-main {
  max-width: 960px;
  margin: 0 auto;
  padding: 30px 16px 60px;
}
.chat-header-bar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 20px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--line);
}
.chat-title {
  margin: 0 0 6px;
  font-size: clamp(24px, 4vw, 32px);
  font-weight: 700;
  letter-spacing: -0.04em;
  color: var(--ink);
}
.chat-subtitle {
  margin: 0;
  color: var(--muted);
  font-size: 14.5px;
  line-height: 1.45;
  max-width: 680px;
}
.chat-stream {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-bottom: 26px;
}
.chat-msg {
  display: flex;
  gap: 14px;
  animation: fadeInMsg 0.28s ease-out both;
}
@keyframes fadeInMsg {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.msg-avatar {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 20px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid var(--line);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
}
.msg-body {
  flex: 1;
  min-width: 0;
}
.msg-author {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 6px;
  letter-spacing: 0.03em;
}

/* User Message Bubble */
.msg-user {
  flex-direction: row-reverse;
}
.msg-user .msg-avatar {
  background: linear-gradient(135deg, #6d5ce7, #4a90e2);
  color: #fff;
}
.msg-user .msg-author {
  text-align: right;
  color: #9cb3ff;
}
.msg-user .user-text {
  background: linear-gradient(135deg, rgba(82, 70, 180, 0.45), rgba(41, 74, 150, 0.45));
  border: 1px solid rgba(133, 117, 255, 0.35);
  border-radius: 18px 4px 18px 18px;
  padding: 14px 18px;
  margin: 0 0 0 auto;
  max-width: 80%;
  font-size: 15.5px;
  line-height: 1.55;
  color: #ffffff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
  word-break: break-word;
}

/* Assistant Message Bubble */
.msg-assistant .msg-avatar {
  background: linear-gradient(135deg, rgba(240, 197, 116, 0.2), rgba(133, 117, 255, 0.25));
  border: 1px solid rgba(240, 197, 116, 0.3);
}
.msg-assistant .msg-body {
  background: linear-gradient(145deg, rgba(27, 37, 76, 0.9), rgba(17, 25, 54, 0.92));
  border: 1px solid rgba(219, 227, 255, 0.14);
  border-radius: 4px 20px 20px 20px;
  padding: 20px 24px 24px;
  box-shadow: var(--shadow);
}
.msg-assistant .answer {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  margin: 0;
}
.msg-assistant .sources {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.sources-disclaimer {
  margin-top: 14px;
  font-size: 12px;
  color: var(--muted);
  font-style: italic;
}
.quick-chip-hint {
  margin-top: 10px;
  font-size: 12px;
  color: #a4b2d6;
  font-style: italic;
}

/* Quick Topic Suggestions */
.chat-quick-suggestions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.quick-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  width: 100%;
  margin-bottom: 2px;
}
.quick-chip {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(219, 227, 255, 0.16);
  color: #dbe2ff;
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 13px;
  font-family: var(--font-ui);
  cursor: pointer;
  transition: all 0.2s ease;
}
.quick-chip:hover {
  background: rgba(133, 117, 255, 0.2);
  border-color: rgba(151, 168, 255, 0.4);
  color: #ffffff;
  transform: translateY(-1px);
}

/* Chat Status Indicator */
.chat-status {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 18px;
  border-radius: 14px;
  background: rgba(24, 33, 68, 0.75);
  border: 1px solid rgba(205, 216, 255, 0.15);
  margin-bottom: 20px;
  color: #b9c6ea;
  font-size: 14px;
}
.thinking-spinner {
  display: inline-block;
  animation: pulseRotate 1.5s infinite ease-in-out;
  font-size: 18px;
}
@keyframes pulseRotate {
  0% { transform: scale(1) rotate(0deg); }
  50% { transform: scale(1.2) rotate(15deg); }
  100% { transform: scale(1) rotate(0deg); }
}

/* Chat Input Bar */
.chat-input-wrapper {
  position: sticky;
  bottom: 14px;
  z-index: 20;
  margin-top: 14px;
  margin-bottom: 18px;
}
.chat-input-form {
  background: rgba(20, 28, 60, 0.88);
  border: 1px solid rgba(224, 232, 255, 0.25);
  border-radius: 20px;
  padding: 12px 14px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.42), inset 0 1px rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(24px);
}
.input-controls {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}
.input-controls textarea {
  flex: 1;
  background: transparent;
  border: none;
  box-shadow: none;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.5;
  resize: none;
  min-height: 44px;
  max-height: 180px;
  padding: 8px 6px;
  font-family: inherit;
}
.input-controls textarea:focus {
  outline: none;
}
.input-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.chat-send-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 14px;
}
.chat-send-btn svg {
  display: inline-block;
  vertical-align: middle;
}
/* =========================================================
   MOBIL QURILMALAR UCHUN MUKAMMAL MOSLASHUVCHANLIK (RESPONSIVE)
   Smartfonlar (iOS/Android), planshetlar va tor ekranlar uchun
   ========================================================= */

@media (max-width: 768px) {
  /* 1. Global mobil asoslar */
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw;
    -webkit-tap-highlight-color: transparent;
  }

  body {
    font-size: 15.5px;
  }

  .wrap {
    padding: 0 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  /* iOS Safari avtomatik kattalashtirish (auto-zoom) xatosini bartaraf qilish */
  input, textarea, select {
    font-size: 16px !important;
  }

  /* 2. Mobil navigatsiya va header */
  .site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }

  .header-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 10px 14px 8px !important;
    min-height: auto !important;
    gap: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .brand {
    font-size: 20px !important;
    align-self: flex-start !important;
    display: inline-flex !important;
  }

  /* Nav paneli: Barcha havolalar ekranda 100% to'liq va ochiq ko'rinadi */
  .nav {
    display: flex !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
    width: 100% !important;
    gap: 6px !important;
    padding: 0 !important;
    margin: 2px 0 0 !important;
    justify-content: stretch !important;
  }

  .nav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 1 auto !important;
    white-space: nowrap !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 8px 10px !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    min-height: 38px !important;
    text-align: center !important;
    box-sizing: border-box !important;
    transition: background 0.15s ease, border-color 0.15s ease !important;
  }

  .nav a[aria-current="page"] {
    background: rgba(137, 133, 255, 0.3) !important;
    border-color: rgba(168, 155, 255, 0.6) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 8px rgba(137, 133, 255, 0.25) !important;
  }

  .nav a.nav-login {
    background: linear-gradient(180deg, var(--gold-face), var(--gold)) !important;
    color: var(--navy-deep) !important;
    border: none !important;
    font-weight: 700 !important;
    box-shadow: 0 3px 0 var(--gold-ledge), 0 4px 10px rgba(0, 0, 0, 0.25) !important;
  }

  @media (max-width: 420px) {
    .nav {
      gap: 5px !important;
    }
    .nav a {
      font-size: 12px !important;
      padding: 7px 7px !important;
      min-height: 35px !important;
    }
  }

  /* 3. Bosh sahifa Hero bloki */
  .home-hero {
    padding: 24px 0 20px !important;
  }

  .home-hero::before {
    border-radius: 0 0 20px 20px !important;
  }

  .hero-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    min-height: auto !important;
  }

  .home-hero h1 {
    font-size: clamp(28px, 8.2vw, 38px) !important;
    line-height: 1.15 !important;
    letter-spacing: -0.04em !important;
    margin: 0 0 10px !important;
  }

  .home-hero .ask-lead {
    font-size: 14.5px !important;
    line-height: 1.5 !important;
    margin: 0 0 16px !important;
    max-width: 100% !important;
  }

  .home-hero .search {
    flex-direction: column !important;
    padding: 8px !important;
    gap: 8px !important;
    border-radius: 16px !important;
    max-width: 100% !important;
  }

  .home-hero .search .search-symbol {
    display: none !important;
  }

  .home-hero .search input {
    width: 100% !important;
    min-height: 46px !important;
    padding: 10px 14px !important;
    font-size: 16px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border-radius: 10px !important;
    box-sizing: border-box;
  }

  .home-hero .search button {
    width: 100% !important;
    min-height: 46px !important;
    padding: 12px 16px !important;
    font-size: 15px !important;
    border-radius: 12px !important;
    justify-content: center !important;
  }

  .home-hero .examples {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin-top: 12px !important;
  }

  .home-hero .examples-label {
    width: 100% !important;
    font-size: 11.5px !important;
    margin-bottom: 2px;
  }

  .home-hero .example {
    font-size: 12px !important;
    padding: 6px 11px !important;
    border-radius: 999px !important;
  }

  .hero-trust {
    font-size: 12px !important;
    flex-wrap: wrap !important;
    gap: 6px 12px !important;
    margin-top: 14px !important;
  }

  .hero-art {
    width: 100% !important;
    max-width: 250px !important;
    min-height: auto !important;
    margin: 6px auto 0 !important;
  }

  .hero-art img {
    width: 100% !important;
    max-width: 210px !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
  }

  .art-note {
    position: static !important;
    margin-top: 8px !important;
    justify-content: center !important;
    padding: 6px 10px !important;
    font-size: 11.5px !important;
  }

  .art-pill {
    top: 4px !important;
    left: 4px !important;
    font-size: 9.5px !important;
    padding: 4px 7px !important;
  }

  /* 4. Xizmatlar kartochkalari */
  .service-section {
    padding: 20px 0 16px !important;
  }

  .service-grid {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  .service-card {
    padding: 13px 15px !important;
  }

  /* 5. AI Chat / Yordamchi sahifasi */
  .chat-page body {
    padding-bottom: 0;
  }

  .chat-main {
    padding: 0 10px 10px !important;
  }

  .chat-header-bar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
    padding: 10px 0 6px !important;
  }

  .chat-title {
    font-size: 19px !important;
    line-height: 1.25 !important;
  }

  .chat-subtitle {
    font-size: 12.5px !important;
    line-height: 1.4 !important;
  }

  #new-chat-btn {
    align-self: flex-start !important;
    padding: 6px 12px !important;
    font-size: 12px !important;
    border-radius: 10px !important;
  }

  .chat-stream {
    gap: 14px !important;
    margin-bottom: 12px !important;
  }

  .chat-msg {
    gap: 8px !important;
  }

  .msg-avatar {
    flex: 0 0 32px !important;
    width: 32px !important;
    height: 32px !important;
    font-size: 15px !important;
    border-radius: 10px !important;
  }

  .msg-assistant .msg-body {
    padding: 12px 14px 16px !important;
    border-radius: 4px 16px 16px 16px !important;
    font-size: 14.5px !important;
    line-height: 1.5 !important;
  }

  .msg-user .user-text {
    max-width: 90% !important;
    padding: 10px 14px !important;
    font-size: 14.5px !important;
    border-radius: 16px 4px 16px 16px !important;
  }

  /* Tezkor takliflar (Quick Chips) - gorizontal suriladigan lenta */
  .chat-quick-suggestions {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 6px !important;
    padding-bottom: 6px !important;
    margin: 10px -4px 0 !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }

  .chat-quick-suggestions::-webkit-scrollbar {
    display: none;
  }

  .quick-chip {
    flex: 0 0 auto !important;
    font-size: 12px !important;
    padding: 6px 11px !important;
    white-space: nowrap !important;
  }

  .chat-status {
    padding: 10px 12px !important;
    font-size: 13px !important;
    gap: 8px !important;
  }

  /* Chat kirish paneli (Sticky Input) */
  .chat-input-wrapper {
    position: sticky !important;
    bottom: 8px !important;
    z-index: 100 !important;
    margin: 8px 0 10px !important;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .chat-input-form {
    padding: 8px 10px !important;
    border-radius: 18px !important;
  }

  .input-controls {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
  }

  .input-controls textarea {
    font-size: 16px !important;
    min-height: 44px !important;
    max-height: 140px !important;
    padding: 8px 6px !important;
  }

  .input-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 8px !important;
    margin-top: 4px !important;
  }

  .mic-btn {
    height: 40px !important;
    padding: 6px 12px !important;
    font-size: 13px !important;
    border-radius: 10px !important;
  }

  .chat-send-btn {
    height: 40px !important;
    padding: 6px 16px !important;
    font-size: 13.5px !important;
    border-radius: 10px !important;
  }

  /* Sud hujjati va yuridik quti moslashuvi */
  .advokat-box {
    padding: 12px 14px !important;
    margin: 12px 0 !important;
    border-radius: 12px !important;
  }

  .template-actions {
    flex-direction: column !important;
    gap: 8px !important;
  }

  .template-actions .btn {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    min-height: 40px !important;
  }

  pre.sample-code {
    white-space: pre-wrap !important;
    word-break: break-word !important;
    font-size: 12px !important;
    max-height: 280px !important;
    overflow-y: auto !important;
    padding: 10px !important;
  }

  .sources {
    margin-top: 14px !important;
    padding-top: 12px !important;
  }

  .sources h3 {
    font-size: 15px !important;
  }

  .sources li {
    font-size: 13px !important;
    margin-bottom: 8px !important;
  }

  /* 6. Ichki sahifalar (Qonunlar, Advokatlar, Organlar, Login) */
  .page-head {
    padding: 24px 0 18px !important;
  }

  .page-head h1 {
    font-size: clamp(23px, 7vw, 30px) !important;
    line-height: 1.2 !important;
  }

  .page-filter {
    font-size: 16px !important;
    min-height: 46px !important;
    border-radius: 12px !important;
    padding: 10px 14px !important;
    width: 100% !important;
    box-sizing: border-box;
  }

  .organs {
    gap: 10px !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .organ, .law {
    padding: 14px 16px !important;
    border-radius: 14px !important;
  }

  .organ h2 {
    font-size: 17px !important;
  }

  .call-btn {
    width: 100% !important;
    justify-content: center !important;
    padding: 12px 16px !important;
    font-size: 15px !important;
    box-sizing: border-box;
  }

  .doc-head h1 {
    font-size: 20px !important;
    line-height: 1.3 !important;
  }

  .doc-articles li {
    padding: 12px 10px !important;
    font-size: 14px !important;
  }

  .auth-box {
    padding: 20px 16px !important;
    border-radius: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .auth-box input {
    width: 100% !important;
    box-sizing: border-box;
  }

  .site-footer {
    padding: 18px 0 !important;
  }

  .site-footer .footer-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
    font-size: 12px !important;
  }

  .opening {
    padding: 16px;
  }

  .opening-title {
    font-size: 26px !important;
  }

  .opening-mark {
    width: 68px !important;
    height: 68px !important;
    font-size: 32px !important;
    border-radius: 20px !important;
  }

  .opening-skip {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin-top: 22px !important;
    display: inline-block !important;
    font-size: 13px !important;
    padding: 8px 18px !important;
  }
}