/*
 * Small hand-written additions for the Authentic Pakistan redesign that
 * Tailwind utility classes don't cleanly express. Everything else in
 * header.php / footer.php / front-page.php is plain Tailwind classes.
 */

main > :first-child { margin-top: 0 !important; }
main > :last-child { margin-bottom: 0 !important; }

/* Horizontal chip scroller (hero "Popular:" tags) — scoped, not global,
   so the rest of the site keeps a normal, visible scrollbar. */
.rpk-scroll-x {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.rpk-scroll-x::-webkit-scrollbar {
  display: none;
}

/* Season tab panels: hidden by default, JS toggles [hidden] off for the active one. */
.rpk-season-panel[hidden] {
  display: none;
}

/* Respect reduced motion for the hover/scale/translate micro-interactions used throughout. */
@media (prefers-reduced-motion: reduce) {
  .rpk-home * {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

/* ---- Single-post article body -------------------------------------------
 * The article body is always the real post content the author wrote in the
 * block editor, so it comes through as plain h2/h3/p/ul/table markup with no
 * Tailwind classes on it (Tailwind preflight is off site-wide, see
 * tailwind-config.js). This is the hand-written "prose" skin that makes that
 * real content match the Authentic Pakistan look, instead of fabricating any
 * of the content itself.
 * -------------------------------------------------------------------------- */
.rpk-article-content {
  color: #404945;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 16px;
  line-height: 1.7;
}
.rpk-article-content > p:first-of-type::first-letter {
  float: left;
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 64px;
  line-height: 0.85;
  color: #115740;
  padding-right: 10px;
  padding-top: 4px;
}
.rpk-article-content h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.25;
  color: #003427;
  margin: 2.5rem 0 1rem;
  scroll-margin-top: 7rem;
  padding-top: 0.75rem;
  border-top: 1px solid #E4DDD0;
}
.rpk-article-content > h2:first-child {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}
.rpk-article-content h3 {
  font-family: 'Playfair Display', serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.35;
  color: #003427;
  margin: 1.75rem 0 0.5rem;
  scroll-margin-top: 7rem;
}
.rpk-article-content p {
  margin: 0 0 1.1rem;
}
.rpk-article-content ul,
.rpk-article-content ol {
  margin: 0 0 1.1rem;
  padding-left: 1.4rem;
}
.rpk-article-content li {
  margin: 0 0 0.4rem;
}
.rpk-article-content ul > li {
  list-style: none;
  position: relative;
  padding-left: 1.4rem;
}
.rpk-article-content ul > li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #2F6B4F;
}
.rpk-article-content strong {
  color: #003427;
  font-weight: 700;
}
.rpk-article-content a {
  color: #115740;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: #9dd2bd;
  text-underline-offset: 2px;
}
.rpk-article-content a:hover {
  color: #2F6B4F;
}
.rpk-article-content blockquote {
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
  background: #F7F4EC;
  border-left: 4px solid #115740;
  border-radius: 0.5rem;
  font-style: italic;
  color: #181d1b;
}
.rpk-article-content figure {
  margin: 1.5rem 0;
}
.rpk-article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 0.75rem;
}
.rpk-article-content figcaption {
  margin-top: 0.5rem;
  font-size: 13px;
  color: #6B706D;
  text-align: center;
}
.rpk-article-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.rpk-article-content .wp-block-table,
.rpk-article-content table {
  border-radius: 0.75rem;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.rpk-article-content thead {
  background: #eaefeb;
}
.rpk-article-content th {
  text-align: left;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 11px;
  font-weight: 700;
  color: #003427;
  padding: 0.75rem 1rem;
}
.rpk-article-content td {
  padding: 0.85rem 1rem;
  border-top: 1px solid #eaefeb;
  color: #404945;
}
.rpk-article-content tbody tr:first-child td {
  border-top: none;
}
.rpk-article-content tbody tr:hover {
  background: #F7F4EC;
}

/* FAQ auto-accordion: only applied by JS to h3/content pairs that follow an
   h2 literally titled "Frequently Asked Questions" in the real post body. */
.rpk-article-content .rpk-faq-q {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  background: #ffffff;
  border: 1px solid #E4DDD0;
  border-radius: 0.75rem;
  padding: 1rem 1.1rem;
  margin: 0 0 0.6rem;
}
.rpk-article-content .rpk-faq-q::after {
  content: 'expand_more';
  font-family: 'Material Symbols Outlined';
  font-size: 20px;
  color: #6B706D;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}
.rpk-article-content .rpk-faq-q[aria-expanded="true"]::after {
  transform: rotate(180deg);
}
.rpk-article-content .rpk-faq-a {
  margin: -0.4rem 0 0.6rem;
  padding: 0 1.1rem 1rem;
}
.rpk-article-content .rpk-faq-a[hidden] {
  display: none;
}
/* ---- Mega menu ------------------------------------------------------------
 * Tailwind preflight is off site-wide, so the menu resets the few browser /
 * legacy style.css defaults it relies on. :where() keeps these at zero
 * specificity so Tailwind utility classes on the same elements still win.
 * -------------------------------------------------------------------------- */
.rpk-mega [hidden],
#rpk-mega-backdrop[hidden] {
  display: none !important;
}
:where(.rpk-mega) :where(ul, ol) {
  list-style: none;
  margin: 0;
  padding: 0;
}
:where(.rpk-mega) :where(p, h3, h4, li) {
  margin: 0;
  max-width: none;
}
:where(.rpk-mega) a,
:where(.rpk-mega) a:hover {
  text-decoration: none;
}
:where(.rpk-mega) button,
:where(#masthead) button {
  appearance: none;
  background: transparent;
  border: 0;
  margin: 0;
  font: inherit;
  color: inherit;
}
:where(.rpk-mega) img {
  display: block;
  max-width: 100%;
}
.rpk-mega summary {
  list-style: none;
}
.rpk-mega summary::-webkit-details-marker {
  display: none;
}

/* Top-level triggers */
.rpk-mega-trigger .rpk-mega-chevron {
  transition: transform 0.2s ease;
}
.rpk-mega-trigger[aria-expanded="true"] {
  background: #ffffff;
  color: #003427;
  box-shadow: 0 1px 4px rgba(0, 52, 39, 0.08);
}
.rpk-mega-trigger[aria-expanded="true"] .rpk-mega-chevron {
  transform: rotate(180deg);
}

/* Region inspector list */
.rpk-region-tab {
  color: #181d1b;
}
.rpk-region-tab:hover {
  background: #ffffff;
}
.rpk-rt-initials {
  background: #eaefeb;
  color: #003427;
}
.rpk-rt-sub {
  color: #6B706D;
}
.rpk-rt-count {
  background: #eaefeb;
  color: #404945;
}
.rpk-rt-chevron {
  opacity: 0;
  width: 0;
  overflow: hidden;
}
.rpk-region-tab.is-active,
.rpk-region-tab.is-active:hover {
  background: #164b3c;
  color: #ffffff;
  box-shadow: 0 6px 16px -6px rgba(0, 52, 39, 0.45);
}
.rpk-region-tab.is-active .rpk-rt-initials {
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
}
.rpk-region-tab.is-active .rpk-rt-sub {
  color: rgba(255, 255, 255, 0.72);
}
.rpk-region-tab.is-active .rpk-rt-count {
  background: rgba(0, 0, 0, 0.22);
  color: #ffffff;
}
.rpk-region-tab.is-active .rpk-rt-chevron {
  opacity: 1;
  width: auto;
  color: #ffffff;
}

/* By Region / By Place Type segmented control */
.rpk-mega-view-btn {
  color: #404945;
  cursor: pointer;
}
.rpk-mega-view-btn .rpk-mega-view-count {
  background: #eaefeb;
  color: #404945;
}
.rpk-mega-view-btn.is-active {
  background: #164b3c;
  color: #ffffff;
}
.rpk-mega-view-btn.is-active .rpk-mega-view-count {
  background: rgba(0, 0, 0, 0.22);
  color: #ffffff;
}

/* Panel entrance */
@media (prefers-reduced-motion: no-preference) {
  .rpk-mega-panel:not([hidden]) > div {
    animation: rpk-mega-in 0.18s ease-out;
  }
  @keyframes rpk-mega-in {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: translateY(0); }
  }
}
/* ---- Homepage hero slideshow ---------------------------------------------- */
.rpk-hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.4s ease;
  overflow: hidden;
}
.rpk-hero-slide.is-active {
  opacity: 1;
}
.rpk-hero-slide img {
  transform: scale(1.03);
  transform-origin: 60% 50%;
}
.rpk-hero-progress {
  width: 0;
}
.rpk-hero-tab {
  opacity: 0.6;
  transition: opacity 0.2s ease;
}
.rpk-hero-tab:hover,
.rpk-hero-tab.is-active {
  opacity: 1;
}
.rpk-hero-tab.is-active .rpk-hero-progress {
  width: 100%;
}
.rpk-hero-dot {
  padding: 0;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.4);
  cursor: pointer;
  transition: width 0.25s ease, background 0.25s ease;
}
.rpk-hero-dot.is-active {
  width: 22px;
  background: #ffffff;
}
.rpk-hero [hidden] {
  display: none !important;
}
@media (prefers-reduced-motion: no-preference) {
  .rpk-hero-slide.is-active img {
    animation: rpk-hero-kenburns 9s ease-out forwards;
  }
  .rpk-hero.is-playing .rpk-hero-tab.is-active .rpk-hero-progress {
    width: 0;
    animation: rpk-hero-progress var(--rpk-hero-interval, 7s) linear forwards;
  }
  @keyframes rpk-hero-kenburns {
    from { transform: scale(1.12); }
    to { transform: scale(1.03); }
  }
  @keyframes rpk-hero-progress {
    from { width: 0; }
    to { width: 100%; }
  }
}
/* ---- Pagination (listings, search, archives, category) -------------------- */
.rpk-pagination .nav-links,
.rpk-cat-pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.rpk-pagination .page-numbers,
.rpk-cat-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid #E4DDD0;
  color: #003427;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.rpk-pagination a.page-numbers:hover,
.rpk-cat-pagination a.page-numbers:hover {
  border-color: #115740;
  color: #115740;
}
.rpk-pagination .page-numbers.current,
.rpk-cat-pagination .page-numbers.current {
  background: #164b3c;
  border-color: #164b3c;
  color: #ffffff;
}
.rpk-pagination .page-numbers.dots,
.rpk-cat-pagination .page-numbers.dots {
  background: transparent;
  border-color: transparent;
  min-width: auto;
}
.rpk-pagination .pagination,
.rpk-cat-pagination .pagination {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
}

/* ---- Contact form (Contact Form 7) in the Authentic Pakistan style -------- */
.rpk-contact-form .wpcf7 p {
  margin: 0 0 16px;
  max-width: none;
}
.rpk-contact-form .wpcf7 label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #003427;
}
.rpk-contact-form .wpcf7 br {
  display: none;
}
.rpk-contact-form .wpcf7-form-control-wrap {
  display: block;
  margin-top: 6px;
}
.rpk-contact-form .wpcf7 input[type="text"],
.rpk-contact-form .wpcf7 input[type="email"],
.rpk-contact-form .wpcf7 input[type="tel"],
.rpk-contact-form .wpcf7 textarea {
  width: 100%;
  background: #f0f5f1;
  border: 1px solid #E4DDD0;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 15px;
  font-weight: 400;
  color: #181d1b;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.rpk-contact-form .wpcf7 textarea {
  min-height: 150px;
  resize: vertical;
}
.rpk-contact-form .wpcf7 input:focus,
.rpk-contact-form .wpcf7 textarea:focus {
  outline: none;
  background: #ffffff;
  border-color: #115740;
  box-shadow: 0 0 0 3px rgba(17, 87, 64, 0.15);
}
.rpk-contact-form .wpcf7 input[type="submit"] {
  appearance: none;
  border: 0;
  cursor: pointer;
  background: #115740;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  padding: 13px 28px;
  border-radius: 10px;
  transition: background 0.2s ease;
}
.rpk-contact-form .wpcf7 input[type="submit"]:hover {
  background: #003427;
}
.rpk-contact-form .wpcf7-not-valid-tip {
  font-size: 12.5px;
  color: #ba1a1a;
  margin-top: 4px;
}
.rpk-contact-form .wpcf7 form .wpcf7-response-output {
  margin: 8px 0 0;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 14px;
}
.rpk-contact-form .wpcf7-spinner {
  vertical-align: middle;
}
/* ---- Sidebar widgets added via Appearance > Widgets ------------------------ */
.rpk-widget ul,
.rpk-widget ol {
  list-style: none;
  margin: 0;
  padding: 0;
}
.rpk-widget li {
  margin: 0;
  padding: 8px 0;
  border-bottom: 1px solid #eaefeb;
  font-size: 14px;
  color: #404945;
}
.rpk-widget li:last-child {
  border-bottom: 0;
}
.rpk-widget a {
  color: #003427;
  text-decoration: none;
}
.rpk-widget a:hover {
  color: #115740;
}
.rpk-widget p {
  font-size: 14px;
  line-height: 1.6;
  color: #404945;
  margin: 0 0 10px;
  max-width: none;
}
.rpk-widget img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}
.rpk-widget select,
.rpk-widget input[type="search"],
.rpk-widget input[type="text"],
.rpk-widget input[type="email"] {
  width: 100%;
  background: #f0f5f1;
  border: 1px solid #E4DDD0;
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 14px;
}
.rpk-widget .wp-block-search__inside-wrapper,
.rpk-widget .search-form {
  display: flex;
  gap: 6px;
}
.rpk-widget button,
.rpk-widget input[type="submit"],
.rpk-widget .wp-block-search__button {
  background: #115740;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  padding: 9px 14px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
/* ---- Comments (Traveler Notes) --------------------------------------------- */
.rpk-comment-list,
.rpk-comment-list .children {
  list-style: none;
  margin: 0;
  padding: 0;
}
.rpk-comment-list .children {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 16px 0 0 22px;
  padding-left: 18px;
  border-left: 2px solid #E4DDD0;
}
.rpk-comment-text p {
  margin: 0 0 8px;
  max-width: none;
}
.rpk-comment-text p:last-child {
  margin-bottom: 0;
}
.rpk-comment-actions a {
  color: #115740;
  text-decoration: none;
}
.rpk-comment-actions a:hover {
  color: #003427;
  text-decoration: underline;
}
.rpk-comment-respond #cancel-comment-reply-link {
  color: #ba1a1a;
}
.rpk-comment-respond .comment-reply-title small {
  font-size: inherit;
}
/* FAQ questions can be h3, h4, h5 or bold paragraphs: give them one look. */
.rpk-article-content .rpk-faq-q {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 16.5px;
  font-weight: 700;
  line-height: 1.4;
  color: #003427;
  text-transform: none;
  letter-spacing: 0;
  max-width: none;
  transition: border-color 0.2s ease, background 0.2s ease;
}
.rpk-article-content .rpk-faq-q strong,
.rpk-article-content .rpk-faq-q b {
  font-weight: 700;
  color: inherit;
}
.rpk-article-content .rpk-faq-q:hover {
  border-color: #115740;
}
.rpk-article-content .rpk-faq-q:focus-visible {
  outline: 2px solid #115740;
  outline-offset: 2px;
}
.rpk-article-content .rpk-faq-q[aria-expanded="true"] {
  border-color: #115740;
  background: #F7F4EC;
}
.rpk-article-content .rpk-faq-a > :last-child {
  margin-bottom: 0;
}
.rpk-article-content .rpk-faq-heading + .rpk-faq-q {
  margin-top: 0.5rem;
}
/* --------------------------------------------------------------------------
 * "In This Guide" (single post TOC) - realpakistan_render_toc()
 * -------------------------------------------------------------------------- */
.rpk-toc { background:#fff; border:1px solid #E4DDD0; border-radius:20px; box-shadow:0 1px 2px rgba(13,53,43,.04), 0 10px 28px -14px rgba(13,53,43,.16); font-family:'Plus Jakarta Sans',sans-serif; overflow:hidden; }
.rpk-toc-head { display:flex; align-items:center; gap:12px; padding:18px 20px 14px; }
.rpk-toc .rpk-toc-icon { width:40px; height:40px; flex:0 0 40px; border-radius:12px; background:#EAF3EE; color:#115740; display:inline-flex; align-items:center; justify-content:center; font-size:21px; }
.rpk-toc-heading { display:flex; flex-direction:column; min-width:0; flex:1 1 auto; }
.rpk-toc-title { font-family:'Playfair Display',serif; font-weight:700; font-size:18px; line-height:1.2; color:#003427; }
.rpk-toc-sub { font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#6B706D; margin-top:4px; }
.rpk-toc-pct { flex:0 0 auto; font-size:12px; font-weight:700; color:#115740; background:#EAF3EE; border-radius:999px; padding:4px 10px; font-variant-numeric:tabular-nums; min-width:46px; text-align:center; }
.rpk-toc-progress { height:4px; margin:0 20px 4px; background:#EFEAE0; border-radius:999px; overflow:hidden; }
.rpk-toc-bar { display:block; height:100%; width:0; background:linear-gradient(90deg,#2F6B4F,#115740); border-radius:inherit; transition:width .25s ease; }
.rpk-toc-nav { padding:8px 10px 10px; }
.rpk-toc-list { list-style:none; margin:0; padding:0; position:relative; }
.rpk-toc--sidebar .rpk-toc-list { max-height:calc(100vh - 17.5rem); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#D9D2C3 transparent; padding-right:2px; }
.rpk-toc--sidebar .rpk-toc-list::-webkit-scrollbar { width:6px; }
.rpk-toc--sidebar .rpk-toc-list::-webkit-scrollbar-thumb { background:#D9D2C3; border-radius:6px; }
.rpk-toc-item { position:relative; margin:0; padding:0; }
.rpk-toc-item:not(:last-child)::after { content:''; position:absolute; left:22px; top:35px; bottom:-5px; width:2px; margin-left:-1px; background:#EDE7DA; border-radius:2px; pointer-events:none; }
.rpk-toc-item.is-done:not(:last-child)::after { background:#9DD2BD; }
.rpk-toc-link { position:relative; z-index:1; display:flex; align-items:flex-start; gap:12px; padding:8px 10px; border-radius:12px; color:#404945; font-size:13.5px; line-height:1.45; text-decoration:none; transition:background-color .2s ease, color .2s ease; }
.rpk-toc-link:hover { background:#F4F7F5; color:#115740; }
.rpk-toc-link:focus-visible { outline:2px solid #115740; outline-offset:1px; }
.rpk-toc-num { flex:0 0 24px; width:24px; height:24px; margin-top:-2px; border-radius:999px; border:1.5px solid #D9D2C3; background:#fff; color:#6B706D; font-size:10.5px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; font-variant-numeric:tabular-nums; transition:background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease; }
.rpk-toc-text { min-width:0; }
.rpk-toc-link:hover .rpk-toc-num { border-color:#115740; color:#115740; }
.rpk-toc-item.is-done .rpk-toc-link { color:#6B706D; }
.rpk-toc-item.is-done .rpk-toc-num { border-color:#9DD2BD; background:#EAF3EE; color:#115740; }
.rpk-toc-item.is-active .rpk-toc-link { background:#EAF3EE; color:#003427; font-weight:600; }
.rpk-toc-item.is-active .rpk-toc-num { background:#115740; border-color:#115740; color:#fff; box-shadow:0 0 0 4px rgba(17,87,64,.12); }
.rpk-toc-foot { border-top:1px solid #EFEAE0; padding:10px 20px 12px; }
.rpk-toc-top { display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:#655e4c; text-decoration:none; transition:color .2s ease; }
.rpk-toc-top:hover { color:#115740; }
.rpk-toc .rpk-toc-top .material-symbols-outlined { font-size:16px; }
.rpk-toc--mobile { margin:0 0 2rem; }
.rpk-toc--mobile > summary { list-style:none; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.rpk-toc--mobile > summary::-webkit-details-marker { display:none; }
.rpk-toc--mobile .rpk-toc-head { padding:14px 16px; }
.rpk-toc .rpk-toc-chevron { flex:0 0 auto; color:#115740; font-size:24px; transition:transform .2s ease; }
.rpk-toc--mobile[open] .rpk-toc-chevron { transform:rotate(180deg); }
.rpk-toc--mobile .rpk-toc-nav { border-top:1px solid #EFEAE0; padding:8px 8px 10px; }
@media (prefers-reduced-motion: reduce) { .rpk-toc-bar, .rpk-toc-link, .rpk-toc-num, .rpk-toc-chevron { transition:none; } }