:root {
  --site-green: #168a52;
  --site-light-green: #dcefe7;
  --site-dark: #102033;
  --site-cream: #fff4cf;
  --site-urdu-bg: #f8d7da;
}

/* =========================================================
   Global
   ========================================================= */

body {
  background: #ffffff;
}

.site-page-text,
.about-content,
.article-content {
  font-size: 1rem;
  line-height: 1.8;
}

.site-page-text p,
.about-content p,
.article-content p {
  color: #6c757d;
  line-height: 1.8;
}

.about-content p {
  margin-bottom: 0;
}

.about-content p:not(:last-child) {
  margin-bottom: 1rem;
}

.site-page-text a,
.about-content a,
.article-content a {
  color: #0d6efd;
  font-weight: 600;
  text-decoration: none;
}

.site-page-text a:hover,
.about-content a:hover,
.article-content a:hover {
  text-decoration: underline;
}

/* =========================================================
   Common Blue Shadow Card
   ========================================================= */

.legal-list-card,
.custom-primary-shadow,
.site-shadow-card {
  background: #ffffff;
  border: 1px solid #f0f3f6;
  border-radius: 14px;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.14) !important;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
}

.legal-list-card:hover,
.custom-primary-shadow:hover,
.site-shadow-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 .85rem 1rem rgba(13, 110, 253, 0.18) !important;
  border-color: #dbeafe;
}

/* Use this class when hover movement is not needed */
.no-hover-card:hover,
.ai-section-card:hover {
  transform: none !important;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.14) !important;
  border-color: #f0f3f6 !important;
}

/* =========================================================
   Common Headings
   ========================================================= */

.about-heading,
.site-section-heading {
  color: #0d6efd;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 10px;
}

.about-heading i,
.site-section-heading i {
  font-size: 1.35rem;
  color: #0d6efd;
}

/* =========================================================
   Common Blue Arrow List
   ========================================================= */

.ai-feature-list,
.site-arrow-list,
.legal-ai-list,
.paper-info-list,
.common-blue-list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

.ai-feature-list li,
.site-arrow-list li,
.legal-ai-list li,
.paper-info-list li,
.common-blue-list li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: 0.75rem;
  line-height: 1.8;
  color: #6c757d;
}

.ai-feature-list li::before,
.site-arrow-list li::before,
.legal-ai-list li::before,
.paper-info-list li::before,
.common-blue-list li::before {
  content: "»";
  position: absolute;
  left: 0;
  top: 0;
  color: #0d6efd;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
}

.ai-feature-list li:last-child,
.site-arrow-list li:last-child,
.legal-ai-list li:last-child,
.paper-info-list li:last-child,
.common-blue-list li:last-child {
  margin-bottom: 0;
}

/* =========================================================
   About Page
   ========================================================= */

.about-content img {
  max-width: 320px;
  height: auto;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.14) !important;
  margin-left: 20px;
  margin-bottom: 12px;
}

/* =========================================================
   Top Menu
   ========================================================= */

.site-topbar {
  background: var(--site-green);
}

.site-topbar .nav-link {
  color: #ffffff !important;
  font-weight: 500;
  padding: 11px 16px !important;
}

.site-topbar .nav-link:hover,
.site-topbar .nav-link.active {
  background: var(--bs-primary-bg-subtle);
  color: #000000 !important;
}

.site-search-input {
  border-radius: 7px;
  border: 0;
}

.disabled-separator {
  color: #ffffff !important;
  opacity: 0.6;
  pointer-events: none;
  cursor: default;
}

.navbar-nav .separator .nav-link {
  padding-left: 8px;
  padding-right: 8px;
}

/* =========================================================
   Feature Links
   ========================================================= */

.site-feature-link {
  color: #ffffff !important;
  font-size: 1rem;
  font-weight: 700;
  padding: 9px 18px;
  min-width: 180px;
  text-align: center;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.12);
  border-left: 1px solid rgba(255, 255, 255, 0.25);
  height: 100%;
}

.site-feature-link:hover,
.site-feature-link.active {
  background: var(--bs-primary-bg-subtle);
  color: #000000 !important;
  text-decoration: none;
}

.site-feature-link.urdu {
  direction: rtl;
  font-size: 1.05rem;
  line-height: 1.7;
}

/* =========================================================
   Ticker Row
   ========================================================= */

.site-ticker-row {
  background: var(--site-light-green);
  color: #1f2a33;
}

.site-ticker-row a {
  color: #1f2a33;
  text-decoration: underline;
  margin: 0 10px;
  white-space: nowrap;
}

.site-ticker-label {
  font-weight: 700;
  color: var(--site-green);
  white-space: nowrap;
}

/* =========================================================
   News Ticker
   ========================================================= */

.site-news-ticker {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
}

.site-news-ticker-track {
  display: inline-block;
  padding-left: 100%;
  animation: siteTickerMove 180s linear infinite;
}

.site-news-ticker:hover .site-news-ticker-track {
  animation-play-state: paused;
}

.site-news-ticker-track a,
.site-news-ticker-track span {
  color: #6c757d;
  text-decoration: none;
  margin-right: 40px;
  font-weight: 500;
}

.site-news-ticker-track a:hover {
  color: var(--bs-danger);
  text-decoration: underline;
}

@keyframes siteTickerMove {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-100%);
  }
}

/* =========================================================
   Social Icons
   ========================================================= */

.site-social a {
  width: 44px;
  height: 44px;
  background: #ffffff;
  border-radius: 8px;
  color: #40bfc5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 6px;
  font-size: 1.15rem;
  text-decoration: none;
}

.site-social a:hover {
  background: var(--site-green);
  color: #ffffff;
}

/* =========================================================
   Brand Area - Dots + Leaf Only
   No Image, No Gradient
   ========================================================= */

.site-brand-area,
.site-brand-section {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  padding: 44px 15px 50px !important;
  min-height: auto !important;
  display: block !important;
  text-align: center !important;
}

/* Dotted pattern on left and right */
.site-brand-section::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  background-image:
    radial-gradient(rgba(13, 110, 253, 0.30) 1.8px, transparent 1.8px),
    radial-gradient(rgba(220, 53, 69, 0.16) 1.6px, transparent 1.6px) !important;
  background-size: 24px 24px, 38px 38px !important;
  background-position: left 34px top 25px, right 34px top 30px !important;
  background-repeat: repeat !important;
  opacity: 0.75 !important;
  mask-image: linear-gradient(
    to right,
    #000 0%,
    #000 26%,
    transparent 43%,
    transparent 57%,
    #000 74%,
    #000 100%
  ) !important;
  -webkit-mask-image: linear-gradient(
    to right,
    #000 0%,
    #000 26%,
    transparent 43%,
    transparent 57%,
    #000 74%,
    #000 100%
  ) !important;
  z-index: 0 !important;
}

/* Leaf-style soft shapes on both sides */
.site-brand-section::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  background:
    radial-gradient(ellipse at 3% 35%, rgba(13, 110, 253, 0.18) 0%, rgba(13, 110, 253, 0.08) 35%, transparent 62%),
    radial-gradient(ellipse at 97% 35%, rgba(13, 110, 253, 0.18) 0%, rgba(13, 110, 253, 0.08) 35%, transparent 62%),
    radial-gradient(ellipse at 16% 78%, rgba(220, 53, 69, 0.10) 0%, transparent 42%),
    radial-gradient(ellipse at 84% 78%, rgba(220, 53, 69, 0.10) 0%, transparent 42%) !important;
  opacity: 1 !important;
  z-index: 1 !important;
}

/* Center clean readable area */
.site-brand-inner {
  position: relative !important;
  display: inline-block !important;
  padding: 8px 34px 10px !important;
  border-radius: 22px !important;
  z-index: 3 !important;
}

.site-brand-inner::before {
  content: "" !important;
  position: absolute !important;
  inset: -6px -22px !important;
  background: radial-gradient(
    ellipse at center,
    rgba(255, 255, 255, 0.96) 0%,
    rgba(255, 255, 255, 0.82) 48%,
    transparent 76%
  ) !important;
  z-index: -1 !important;
}

/* Logo */
.site-logo {
  max-width: 64px !important;
  height: auto !important;
  filter: drop-shadow(0 8px 14px rgba(13, 110, 253, 0.18)) !important;
}

/* Site title */
.site-title,
.site-brand-section h1 {
  color: #102033 !important;
  font-size: 2.7rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  margin-top: 14px !important;
  margin-bottom: 8px !important;
}

/* Slogan */
.site-slogan {
  color: #0d6efd !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  margin-bottom: 0 !important;
}

/* Keep content above background design */
.site-brand-section .site-brand-inner,
.site-brand-section .site-logo,
.site-brand-section h1,
.site-brand-section .site-title,
.site-brand-section .site-slogan {
  position: relative !important;
  z-index: 3 !important;
}

/* =========================================================
   Main Menu
   ========================================================= */

.site-main-menu {
  background: var(--bs-danger);
}

.site-main-menu .nav-link {
  color: #ffffff !important;
  padding: 10px 10px !important;
}

.site-main-menu .nav-link:hover,
.site-main-menu .nav-link.active,
.site-main-menu .nav-item.dropdown:hover > .nav-link {
  background: var(--bs-danger-bg-subtle);
  color: #000000 !important;
}

/* =========================================================
   Dropdown Menu
   ========================================================= */

.site-main-menu .dropdown-menu {
  margin-top: 0;
  border-radius: 0;
  border: 0;
}

.site-main-menu .dropdown-item {
  font-weight: 500;
  padding: 10px 16px;
}

.site-main-menu .dropdown-item:hover,
.site-main-menu .dropdown-item:focus,
.site-main-menu .dropdown-item.active {
  background: var(--bs-danger-bg-subtle);
  color: #000000 !important;
}

/* Open dropdown on hover for desktop */
@media (min-width: 992px) {
  .site-main-menu .dropdown:hover > .dropdown-menu {
    display: block;
  }

  .site-main-menu .dropdown:hover > .dropdown-toggle::after {
    transform: rotate(180deg);
  }
}

/* =========================================================
   AI Assistant Link
   ========================================================= */

.site-ai-link {
  color: #000000 !important;
  font-size: 1rem;
  font-weight: 700;
  padding: 9px 22px;
  min-width: 190px;
  text-align: center;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bs-danger-bg-subtle);
  border-left: 1px solid rgba(255, 255, 255, 0.25);
  height: 100%;
}

.site-ai-link:hover,
.site-ai-link.active {
  background: var(--bs-warning-bg-subtle);
  color: #000000 !important;
  text-decoration: none;
}

.site-ai-link i {
  margin-right: 7px;
}

/* =========================================================
   Record / Category Cards
   ========================================================= */

.paper-category-card {
  background: #ffffff;
  border: 1px solid #f0f3f6;
  border-radius: 14px;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.14) !important;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
  height: 100%;
}

.paper-category-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 .85rem 1rem rgba(13, 110, 253, 0.18) !important;
  border-color: #dbeafe;
}

.paper-category-card .card-header {
  background: #0d6efd;
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  padding: 16px 14px;
  border-bottom: 0;
}

.paper-category-card .card-body {
  padding: 26px 22px;
  min-height: 210px;
  display: flex;
  flex-direction: column;
}

.paper-category-title {
  color: #ffffff;
  margin-bottom: 0;
  line-height: 1.5;
}

.paper-category-detail {
  color: #6c757d;
  line-height: 1.8;
  margin-bottom: 18px;
  min-height: 78px;
}

.paper-count {
  font-weight: 700;
  color: #0d6efd;
}

.paper-view-btn {
  border-radius: 10px;
  font-weight: 600;
}

.paper-view-btn:hover {
  color: #ffffff;
}

/* =========================================================
   Research Listing Cards
   ========================================================= */

.research-card {
  background: #ffffff;
  border: 1px solid #f0f3f6;
  border-radius: 14px;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.14) !important;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
}

.research-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 .85rem 1rem rgba(13, 110, 253, 0.18) !important;
  border-color: #dbeafe;
}

.category-intro {
  background: #ffffff;
  padding: 24px;
  margin-bottom: 24px;
}

.section-intro {
  color: #6c757d;
  line-height: 1.8;
}

.category-summary-box {
  margin-top: 16px;
  margin-bottom: 18px;
}

.summary-line-en {
  border-left: 4px solid #d9d9d9;
  padding-left: 16px;
  font-size: 1rem;
  line-height: 1.8;
  color: #6c757d;
  margin-bottom: 16px;
}

.summary-line-ur {
  border-right: 4px solid #d9d9d9;
  padding-right: 16px;
  font-size: 1.08rem;
  line-height: 2.1;
  color: #6c757d;
  text-align: right;
  direction: rtl;
  margin-bottom: 16px;
}

.research-action-btn {
  border-radius: 10px;
  font-weight: 600;
}

.records-count {
  color: #6c757d;
  line-height: 1.8;
}

/* =========================================================
   Forms
   ========================================================= */

.site-form-card,
.search-form-card {
  background: #ffffff;
  border: 1px solid #f0f3f6;
  border-radius: 14px;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.14) !important;
  padding: 24px;
  margin-bottom: 24px;
}

.form-control,
.form-select {
  border-radius: 10px;
  border-color: #dbeafe;
  box-shadow: none !important;
}

.form-control:focus,
.form-select:focus {
  border-color: #0d6efd;
  box-shadow: 0 0 0 .2rem rgba(13, 110, 253, 0.12) !important;
}

/* =========================================================
   Pagination
   ========================================================= */

.pagination .page-link {
  border-radius: 8px;
  margin-right: 5px;
  color: #0d6efd;
}

.pagination .page-item.active .page-link {
  background-color: #0d6efd;
  border-color: #0d6efd;
  color: #ffffff;
}

/* =========================================================
   Empty / Icon Blocks
   ========================================================= */

.empty-icon,
.not-found-icon {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: #e8f2ff;
  color: #0d6efd;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 2.2rem;
}

/* =========================================================
   Map
   ========================================================= */

.map-wrap {
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid #eef2f7;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.14) !important;
  background: #ffffff;
}

.map-wrap iframe {
  width: 100%;
  height: 500px;
  border: 0;
  display: block;
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 991px) {
  .site-topbar .nav-link,
  .site-main-menu .nav-link {
    padding: 12px 10px;
  }

  .navbar-nav .separator {
    display: none;
  }

  .site-title,
  .site-brand-section h1 {
    font-size: 2rem !important;
  }

  .site-logo {
    max-width: 60px !important;
  }

  .site-brand-area,
  .site-brand-section {
    padding: 34px 12px 40px !important;
    min-height: auto !important;
  }

  .site-social {
    margin-top: 10px;
    text-align: center;
  }

  .site-feature-link,
  .site-ai-link {
    width: 100%;
    min-width: auto;
    padding: 13px 18px;
  }

  .site-slogan {
    font-size: 0.95rem !important;
  }
}

@media (max-width: 767px) {
  .about-content {
    font-size: 1rem;
  }

  .about-content img {
    float: none !important;
    display: block;
    max-width: 100%;
    margin: 0 auto 18px auto;
  }

  .about-heading {
    align-items: flex-start;
  }

  .paper-category-card .card-body {
    padding: 22px 18px;
    min-height: auto;
  }

  .paper-category-detail {
    min-height: auto;
  }

  .paper-view-btn {
    width: 100%;
  }

  .category-intro {
    padding: 18px;
  }

  .summary-line-en {
    font-size: 1rem;
  }

  .summary-line-ur {
    font-size: 1.05rem;
  }

  .research-action-btn {
    width: 100%;
    text-align: center;
    margin-bottom: 8px;
  }

  .map-wrap iframe {
    height: 380px;
  }

  .site-brand-area,
  .site-brand-section {
    padding: 30px 12px 36px !important;
    min-height: auto !important;
  }

  .site-brand-section::before {
    opacity: 0.42 !important;
    background-size: 22px 22px, 34px 34px !important;
  }

  .site-brand-section::after {
    opacity: 0.75 !important;
  }

  .site-brand-inner {
    padding: 6px 18px 8px !important;
  }

  .site-brand-inner::before {
    inset: -4px -12px !important;
  }

  .site-title,
  .site-brand-section h1 {
    font-size: 1.8rem !important;
  }

  .site-logo {
    max-width: 58px !important;
  }

  .site-slogan {
    font-size: 0.92rem !important;
  }
}

.success-icon {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: #eaf8ef;
  color: #198754;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
}

/* =========================================================
   Article Detail / AI Assistant
   ========================================================= */

.urdu-text {
  direction: rtl;
  text-align: right;
  font-size: 1.15rem;
  line-height: 2.2;
}

.urdu-text ul,
.urdu-text ol {
  padding-right: 1.4rem;
  padding-left: 0;
}

.quick-options-radio {
  background: #f8fbff;
  border: 1px solid #d6e4f0;
  border-radius: 10px;
  padding: 14px;
}

.quick-options-radio h4 {
  border-bottom: 1px solid #d6e4f0;
  padding-bottom: 8px;
}

.quick-option-item {
  background: #ffffff;
  border: 1px solid #e5edf5;
  border-radius: 8px;
  padding: 10px 12px;
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.quick-option-item .form-check-input {
  cursor: pointer;
  margin-top: 0;
  margin-left: 0;
  flex-shrink: 0;
}

.quick-option-item .form-check-label {
  cursor: pointer;
  line-height: 1.5;
  width: 100%;
}

.quick-option-item:hover {
  border-color: #0d6efd;
  background: #f4f9ff;
}

.quick-option-item:has(.form-check-input:checked) {
  border-color: #0d6efd;
  background: #eef6ff;
}

.urdu-option {
  direction: rtl;
  text-align: right;
  padding: 10px 12px;
  min-height: 54px;
}

.urdu-option .form-check-input {
  float: none;
  margin-right: 0;
  margin-left: 0;
  flex-shrink: 0;
}

.urdu-option .form-check-label {
  font-size: 1.05rem;
  line-height: 1.9;
}

.key-points-list ul,
.ai-answer-content ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

.key-points-list li,
.ai-answer-content li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: 0.7rem;
  line-height: 1.7;
}

.key-points-list li::before,
.ai-answer-content li::before {
  content: "»";
  position: absolute;
  left: 0;
  top: 0;
  color: #0d6efd;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
}

.ai-answer-content.urdu-text ul {
  padding-right: 0;
  padding-left: 0;
}

.ai-answer-content.urdu-text li {
  padding-right: 1.8rem;
  padding-left: 0;
}

.ai-answer-content.urdu-text li::before {
  right: 0;
  left: auto;
  content: "»";
}

.ai-loading-dots span {
  display: inline-block;
  animation: aiDotBlink 1.2s infinite both;
}

.ai-loading-dots span:nth-child(2) {
  animation-delay: 0.2s;
}

.ai-loading-dots span:nth-child(3) {
  animation-delay: 0.4s;
}

@keyframes aiDotBlink {
  0%, 80%, 100% {
    opacity: 0;
  }

  40% {
    opacity: 1;
  }
}

/* =========================================================
   Legal Framework Page
   ========================================================= */

.legal-number {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #0d6efd;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  flex-shrink: 0;
}

.legal-title {
  line-height: 1.5;
  margin-bottom: 8px;
}

.legal-summary {
  color: #6c757d;
  line-height: 1.8;
  margin-bottom: 0;
}

.legal-ai-list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

.legal-ai-list li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: 0.75rem;
  line-height: 1.8;
  color: #6c757d;
}

.legal-ai-list li::before {
  content: "»";
  position: absolute;
  left: 0;
  top: 0;
  color: #0d6efd;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
}

.legal-ai-list li:last-child {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .legal-number {
    width: 36px;
    height: 36px;
    font-size: 0.9rem;
  }
}

/* =========================================================
   Legal Detail Page Text
   ========================================================= */

.legal-content {
  color: #6c757d;
  line-height: 1.9;
}

.legal-content p {
  color: #6c757d;
  margin-bottom: 1rem;
  line-height: 1.9;
}

.legal-content ul,
.legal-content ol {
  color: #6c757d;
  margin-bottom: 0;
  padding-left: 1.4rem;
}

.legal-content li {
  color: #6c757d;
  margin-bottom: 0.65rem;
  line-height: 1.8;
}

/* =========================================================
   Urdu List Icon Alignment
   ========================================================= */

.urdu-text.key-points-list ul,
.urdu-text.ai-answer-content ul,
.urdu-text ul {
  padding-right: 0;
  padding-left: 0;
}

.urdu-text.key-points-list li,
.urdu-text.ai-answer-content li,
.urdu-text li {
  position: relative;
  padding-right: 1.8rem;
  padding-left: 0;
  text-align: right;
}

.urdu-text.key-points-list li::before,
.urdu-text.ai-answer-content li::before,
.urdu-text li::before {
  content: "»";
  position: absolute;
  right: 0;
  left: auto;
  top: 0;
  color: #0d6efd;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
}

.empty-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #e8f2ff;
  color: #0d6efd;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 2.3rem;
}

/* =========================================================
   PDF Viewer
   ========================================================= */

.pdf-viewer-wrap {
  width: 100%;
  border: 1px solid #dee2e6;
  border-radius: 14px;
  overflow: hidden;
  background: #f8f9fa;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.10) !important;
}

.pdf-viewer {
  width: 100%;
  height: 720px;
  border: 0;
  display: block;
}

@media (max-width: 767px) {
  .pdf-viewer {
    height: 520px;
  }
}

/* =========================================================
   AI Help List
   ========================================================= */

.ai-help-list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

.ai-help-list li {
  position: relative;
  padding: 12px 14px 12px 34px;
  margin-bottom: 10px;
  line-height: 1.7;
  color: #6c757d;
  background: #ffffff;
  border: 1px solid #e5efff;
  border-radius: 10px;
  transition: all 0.2s ease-in-out;
}

.ai-help-list li::before {
  content: "»";
  position: absolute;
  left: 14px;
  top: 10px;
  color: #0d6efd;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
}

.ai-help-list li:hover {
  background: #e7f1ff;
  color: #0d6efd;
  border-color: #b6d4fe;
  transform: translateX(4px);
}

.ai-help-list li:hover::before {
  color: #dc3545;
}

.ai-help-list li:last-child {
  margin-bottom: 0;
}

/* =========================================================
   Home Sidebar Feature Card
   ========================================================= */

.home-sidebar-feature-card {
  background: #ffffff;
  border: 1px solid #f0f3f6;
  border-radius: 14px;
  box-shadow: 0 .75rem .75rem rgba(13, 110, 253, 0.14) !important;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
}

.home-sidebar-feature-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 .85rem 1rem rgba(13, 110, 253, 0.18) !important;
  border-color: #dbeafe;
}

.home-sidebar-feature-card .feature-card-header {
  background: #0d6efd;
  color: #ffffff;
  padding: 14px 16px;
  font-weight: 700;
  text-align: center;
  font-size: 1.05rem;
}

.home-sidebar-feature-card .feature-card-body {
  padding: 18px;
}

.home-sidebar-feature-card .feature-card-text {
  color: #6c757d;
  line-height: 1.75;
  font-size: 0.96rem;
  margin-bottom: 16px;
}

.home-sidebar-feature-card .feature-mini-list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 16px;
}

.home-sidebar-feature-card .feature-mini-list li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 8px;
  color: #6c757d;
  line-height: 1.6;
  font-size: 0.94rem;
}

.home-sidebar-feature-card .feature-mini-list li::before {
  content: "»";
  position: absolute;
  left: 0;
  top: 0;
  color: #0d6efd;
  font-weight: 700;
}

.home-sidebar-feature-card .btn {
  font-weight: 600;
  border-radius: 8px;
}

/* Urdu text style - same as article Urdu summary */
.urdu-text,
.urdu-summary-box,
.summary-line-ur,
.home-sidebar-feature-card[lang="ur"],
.home-sidebar-feature-card[lang="ur"] .feature-card-text,
.home-sidebar-feature-card[lang="ur"] .feature-mini-list li {
  font-size: 1.05rem;
  line-height: 2;
  text-align: right;
}

/* Urdu sidebar list: arrow on right side */
.home-sidebar-feature-card[lang="ur"] .feature-mini-list {
  direction: rtl;
  text-align: right;
  padding-right: 0;
  padding-left: 0;
}

.home-sidebar-feature-card[lang="ur"] .feature-mini-list li {
  padding-right: 22px;
  padding-left: 0;
}

.home-sidebar-feature-card[lang="ur"] .feature-mini-list li::before {
  content: "»";
  right: 0;
  left: auto;
  top: 0;
  color: #0d6efd;
  font-weight: 700;
}

.footer-policy-links a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

@media (max-width: 576px) {
  .footer-policy-links a,
  .footer-policy-links span {
    display: inline-block;
    margin-bottom: 8px;
  }
}