/* ==========================================================================
   Уурга.com — нэмэлт CSS
   Tailwind-аар шийдэгдэхгүй, эсвэл хэт урт давтагдах зүйлсийг энд бичнэ.
   Энэ файл нь Tailwind CDN script-ийн ДАРАА ачаалагдана.
   ========================================================================== */

/* ===== Үндсэн ===== */
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #111827;
  background-color: #fff;
}

/* Tailwind CDN ачаалагдах хүртэлх "нүцгэн" агшинг нуух */
[x-cloak] { display: none !important; }

/* ===== Товч ===== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border-radius: .5rem;
  padding: .625rem 1.25rem;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.25rem;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.btn:focus-visible {
  outline: 2px solid #12a150;
  outline-offset: 2px;
}

.btn-primary { background-color: #12a150; color: #fff; }
.btn-primary:hover { background-color: #0e8a44; }

.btn-secondary { background-color: #fff; color: #1f2937; border: 1px solid #d1d5db; }
.btn-secondary:hover { background-color: #f9fafb; }

.btn-ghost { color: #374151; }
.btn-ghost:hover { background-color: #f3f4f6; }

.btn-sm { padding: .375rem .75rem; font-size: .8125rem; }
.btn-lg { padding: .875rem 1.75rem; font-size: 1rem; }
.btn-block { width: 100%; }

/* ===== Форм ===== */
.input,
.select,
.textarea {
  width: 100%;
  border: 1px solid #d1d5db;
  border-radius: .5rem;
  padding: .625rem .875rem;
  font-size: .875rem;
  color: #111827;
  background-color: #fff;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.input::placeholder,
.textarea::placeholder { color: #9ca3af; }
.input:focus,
.select:focus,
.textarea:focus {
  border-color: #12a150;
  box-shadow: 0 0 0 3px rgba(18, 161, 80, .15);
}
.label {
  display: block;
  margin-bottom: .375rem;
  font-size: .875rem;
  font-weight: 500;
  color: #374151;
}

/* ===== Хэвтээ гүйлгэх мөрний scrollbar-ыг нуух (ангилалын мөр, tab) ===== */
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

/* ===== Drawer / Modal ===== */
body.is-locked { overflow: hidden; }

[data-panel] { visibility: hidden; opacity: 0; transition: opacity .2s ease, visibility .2s ease; }
[data-panel].is-open { visibility: visible; opacity: 1; }

[data-panel] .panel-sheet { transform: translateX(-100%); transition: transform .25s ease; }
[data-panel].is-open .panel-sheet { transform: translateX(0); }

[data-panel] .panel-box { transform: translateY(12px) scale(.98); transition: transform .2s ease; }
[data-panel].is-open .panel-box { transform: translateY(0) scale(1); }

/* ===== Accordion (FAQ) ===== */
[data-accordion-body] {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .25s ease;
}
[data-accordion-body] > div { overflow: hidden; }
[data-accordion-item].is-open [data-accordion-body] { grid-template-rows: 1fr; }
[data-accordion-item].is-open [data-accordion-chevron] { transform: rotate(180deg); }
[data-accordion-chevron] { transition: transform .2s ease; }

/* ===== Dropdown ===== */
[data-dropdown] { position: relative; }
[data-dropdown-menu] { display: none; }
[data-dropdown].is-open [data-dropdown-menu] { display: block; }

/* ===== Tab ===== */
[data-tab-panel][hidden] { display: none; }

/* Доогуур зураастай tab (захиалгын жагсаалт, профайл) */
.tab {
  padding: .75rem .25rem;
  font-size: .875rem;
  font-weight: 500;
  color: #6b7280;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  white-space: nowrap;
}
.tab:hover { color: #111827; }
.tab.is-active { color: #12a150; border-bottom-color: #12a150; font-weight: 600; }

/* Дөрвөлжин tab (багц сонгох) */
.tab-pill {
  flex: 1 1 0;
  padding: .625rem .75rem;
  font-size: .8125rem;
  font-weight: 600;
  color: #6b7280;
  background: #fff;
  border-bottom: 2px solid #e5e7eb;
  cursor: pointer;
  white-space: nowrap;
}
.tab-pill:hover { color: #111827; }
.tab-pill.is-active { color: #12a150; border-bottom-color: #12a150; background: #f0fdf4; }

/* ===== Хэвлэх ===== */
@media print {
  header, footer, .no-print { display: none !important; }
}