/*
Theme Name: TripNStay
Theme URI: https://www.tripnstay.com
Author: Mahesh Kumar Sahu
Description: Modern Indian travel magazine — self-contained, no CDN CSS framework.
Version: 5.2
Requires at least: 5.9
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: tripnstay
*/

/* ── Variables ─────────────────────────────────────────── */
:root{
  --accent:#c91322; --accent-dk:#a00f1a;
  --text-h:#111827; --text-b:#374151; --text-m:#6b7280;
  --border:#e2e2de; --card:#fff; --r:8px;
}

/* ── Global Reset ───────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  font-size:1rem;line-height:1.6;color:var(--text-b);
  background:#fff;overflow-x:hidden;width:100%;max-width:100%;
}
body>*{max-width:100vw}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none;padding:0;margin:0}

/* ALL links — no underline, no blue, ever */
a,a:link,a:visited,a:hover,a:focus,a:active{
  text-decoration:none!important;color:inherit;transition:color .18s;
}

/* ── Section Header ─────────────────────────────────────── */
.sec-head{display:flex;align-items:center;justify-content:space-between;
  margin-bottom:1.1rem;padding-bottom:.65rem;
  border-bottom:2px solid var(--border);position:relative}
.sec-head::before{content:'';position:absolute;bottom:-2px;left:0;
  width:56px;height:2px;background:var(--accent)}
.sec-head h2{font-size:.75rem;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--text-h);margin:0;
  padding-left:.7rem;border-left:4px solid var(--accent);line-height:1.2}
.sec-head a.view-all{font-size:.7rem;font-weight:700;color:var(--accent)!important;
  text-transform:uppercase;letter-spacing:.08em;
  display:flex;align-items:center;gap:.2rem;white-space:nowrap}

/* ── Category Badge — always red ───────────────────────── */
.cat-badge,a.cat-badge,span.cat-badge,
.cat-badge:link,.cat-badge:visited,.cat-badge:hover,.cat-badge:focus{
  display:inline-block!important;background:var(--accent)!important;
  color:#fff!important;font-size:.6rem!important;font-weight:800!important;
  padding:.18rem .58rem!important;border-radius:3px!important;
  text-transform:uppercase!important;letter-spacing:.07em!important;
  text-decoration:none!important;line-height:1.5!important;
  cursor:pointer;transition:opacity .15s;
}
.cat-badge:hover,a.cat-badge:hover{opacity:.85!important;color:#fff!important}

/* ── Filter Pills ───────────────────────────────────────── */
.pills-scroll-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;margin-bottom:1.35rem}
.pills-scroll-wrap>div{display:flex;gap:.4rem;padding-bottom:.2rem;min-width:max-content}
a.pill-all,a.pill-all:link,a.pill-all:visited{
  display:inline-block!important;background:var(--accent)!important;
  color:#fff!important;text-decoration:none!important;border-radius:20px!important;
  padding:.38rem .95rem!important;font-size:.75rem!important;font-weight:700!important;
  border:2px solid var(--accent)!important;white-space:nowrap!important}
a.pill,a.pill:link,a.pill:visited{
  display:inline-block!important;background:#fff!important;
  color:#374151!important;text-decoration:none!important;border-radius:20px!important;
  padding:.36rem .9rem!important;font-size:.75rem!important;font-weight:600!important;
  border:1.5px solid var(--border)!important;white-space:nowrap!important;transition:all .18s!important}
a.pill:hover{border-color:var(--accent)!important;color:var(--accent)!important}

/* ── Post Card ──────────────────────────────────────────── */
.post-card{background:var(--card);border-radius:var(--r);overflow:hidden;
  border:1px solid var(--border);box-shadow:0 2px 8px rgba(0,0,0,.06);
  transition:box-shadow .22s,transform .22s}
.post-card:hover{box-shadow:0 10px 32px rgba(0,0,0,.12);transform:translateY(-3px)}
.post-card .thumb{display:block;overflow:hidden;aspect-ratio:16/9;background:#e5e7eb}
.post-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.post-card:hover .thumb img{transform:scale(1.04)}
.post-card .body{padding:.85rem .95rem .9rem}
.post-card h3{font-size:.93rem;font-weight:700;line-height:1.38;color:var(--text-h);
  margin:.42rem 0 .5rem;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
.post-card h3 a,.post-card h3 a:link,.post-card h3 a:visited{
  color:var(--text-h)!important;text-decoration:none!important}
.post-card h3 a:hover{color:var(--accent)!important}
.post-card .meta{display:flex;align-items:center;gap:.5rem;font-size:.7rem;
  color:var(--text-m);border-top:1px solid #f0f0eb;padding-top:.5rem;
  margin-top:.35rem;flex-wrap:wrap}
.post-card .meta span{display:flex;align-items:center;gap:.25rem}

/* ── List Card ──────────────────────────────────────────── */
.list-card{display:flex;gap:.85rem;background:var(--card);border-radius:var(--r);
  border:1px solid var(--border);box-shadow:0 2px 6px rgba(0,0,0,.05);
  transition:box-shadow .22s;padding:.65rem;align-items:flex-start}
.list-card:hover{box-shadow:0 6px 20px rgba(0,0,0,.1)}
.list-card .thumb{flex-shrink:0;width:90px;height:72px;border-radius:5px;overflow:hidden}
.list-card .thumb img{width:100%;height:100%;object-fit:cover}
.list-card .body{flex:1;min-width:0}
.list-card h4{font-size:.83rem;font-weight:700;color:var(--text-h);margin:.25rem 0 .28rem;
  line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.list-card h4 a,.list-card h4 a:link{color:var(--text-h)!important;text-decoration:none!important}
.list-card h4 a:hover{color:var(--accent)!important}
.list-card .date{font-size:.68rem;color:var(--text-m)}

/* ── Hero Post ──────────────────────────────────────────── */
.hero-post{position:relative;border-radius:var(--r);overflow:hidden;background:#111}
.hero-post img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;transition:transform .6s;display:block}
.hero-post:hover img{transform:scale(1.03)}
.hero-post .overlay{position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.25) 55%,transparent 100%)}
.hero-post a,.hero-post a:link,.hero-post a:visited{color:inherit!important;text-decoration:none!important}

/* ── Desktop Nav ────────────────────────────────────────── */
#site-nav .menu{display:flex;list-style:none;margin:0;padding:0}
#site-nav .menu>li{position:relative}
#site-nav .menu>li>a{display:block;padding:.8rem .85rem;font-size:.86rem;
  font-weight:700;color:var(--text-b)!important;text-decoration:none!important;
  white-space:nowrap;transition:color .15s}
#site-nav .menu>li>a:hover,
#site-nav .menu>li.current-menu-item>a{color:var(--accent)!important}
#site-nav .menu>li.current-menu-item>a{border-bottom:3px solid var(--accent);margin-bottom:-3px}
#site-nav .menu .sub-menu{display:none;position:absolute;top:100%;left:0;
  background:#fff;min-width:210px;border-radius:.5rem;
  box-shadow:0 10px 35px rgba(0,0,0,.12);z-index:9999;
  list-style:none;padding:.4rem 0;margin:0;border:1px solid rgba(0,0,0,.07)}
#site-nav .menu>li:hover>.sub-menu{display:block;animation:slideDown .15s ease}
@keyframes slideDown{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
#site-nav .menu .sub-menu li{border-bottom:1px solid #f5f5f2}
#site-nav .menu .sub-menu li:last-child{border:none}
#site-nav .menu .sub-menu li a{display:block;padding:.52rem 1.1rem;
  color:var(--text-b)!important;font-size:.84rem;font-weight:600;
  text-decoration:none!important;transition:background .12s,color .12s}
#site-nav .menu .sub-menu li a:hover{background:#fafaff;color:var(--accent)!important}

/* ── Mobile Nav ─────────────────────────────────────────── */
#mobile-nav-menu .menu{list-style:none;margin:0;padding:0}
#mobile-nav-menu .menu>li{border-bottom:1px solid rgba(255,255,255,.06)}
#mobile-nav-menu .menu>li>a{display:block;padding:.82rem 1.25rem;
  color:#cbd5e1!important;font-size:.9rem;font-weight:600;
  text-decoration:none!important;transition:color .15s}
#mobile-nav-menu .menu>li>a:hover{color:#fff!important;background:rgba(255,255,255,.04)}
#mobile-nav-menu .menu .sub-menu{list-style:none;margin:0;padding:0;background:rgba(0,0,0,.18)}
#mobile-nav-menu .menu .sub-menu li a{display:block;padding:.6rem 2rem;
  color:#94a3b8!important;font-size:.84rem;text-decoration:none!important}
#mobile-nav-menu .menu .sub-menu li a:hover{color:#fff!important}

/* ── Responsive show/hide (replaces Tailwind/Bootstrap classes) ── */
.tns-desktop-nav,.tns-desktop-ad{display:none}
.tns-mobile-only{display:block}
@media(min-width:1024px){
  .tns-desktop-nav{display:block}
  .tns-desktop-ad{display:flex}
  .tns-mobile-only{display:none!important}
}

/* ── Sidebar ─────────────────────────────────────────────── */
.sb-widget{background:var(--card);border-radius:var(--r);border:1px solid var(--border);
  box-shadow:0 2px 10px rgba(0,0,0,.06);overflow:hidden;margin-bottom:1.25rem}
.sb-widget-head{display:flex;align-items:center;gap:.5rem;
  padding:.7rem .95rem .6rem;border-bottom:1px solid var(--border)}
.sb-widget-head .bar{width:3px;height:16px;background:var(--accent);border-radius:2px;flex-shrink:0}
.sb-widget-head h3{font-size:.7rem;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-h);margin:0}
.sb-widget-body{padding:.6rem .85rem .7rem}
.sb-widget a,.sb-widget a:link,.sb-widget a:visited{text-decoration:none!important;color:inherit}
.sb-widget a:hover .pk-t,
.sb-widget a:hover .rt,
.sb-widget a:hover .pkt{color:var(--accent)!important}
.pk-t,.rt,.pkt{color:var(--text-h);transition:color .15s}
.widget-title{font-size:.7rem!important;font-weight:800!important;
  letter-spacing:.1em!important;text-transform:uppercase!important;
  color:var(--text-h)!important;padding-bottom:.5rem!important;
  border-bottom:2px solid var(--accent)!important;margin-bottom:.8rem!important}

/* ── Ticker ──────────────────────────────────────────────── */
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.6)}}
.ticker-wrap{overflow:hidden;width:100%;max-width:100vw}
#ticker-track:hover{animation-play-state:paused}
.ticker-wrap a{text-decoration:none!important}

/* ── Progress + Back to Top ─────────────────────────────── */
#reading-progress{position:fixed;top:0;left:0;height:3px;background:var(--accent);
  z-index:99998;width:0;pointer-events:none;transition:width .1s linear}
#back-to-top{position:fixed;bottom:1.5rem;right:1.5rem;background:var(--accent)!important;
  color:#fff!important;border:none;width:2.6rem;height:2.6rem;border-radius:50%;
  cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;
  z-index:9998;display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 16px rgba(201,19,34,.4);text-decoration:none!important}
#back-to-top.visible{opacity:1;pointer-events:auto}
#back-to-top:hover{transform:translateY(-3px)}

/* ── Search Overlay ──────────────────────────────────────── */
#search-overlay{display:none}
#search-overlay.active{display:flex!important}
#search-overlay a{text-decoration:none!important}

/* ── Pagination ──────────────────────────────────────────── */
.nav-links{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.page-numbers{display:inline-flex;align-items:center;justify-content:center;
  min-width:2.15rem;height:2.15rem;padding:0 .55rem;border:1.5px solid var(--border);
  border-radius:5px;color:var(--text-b)!important;font-size:.84rem;font-weight:600;
  transition:all .15s;background:var(--card);text-decoration:none!important}
.page-numbers:hover:not(.current){border-color:var(--accent);color:var(--accent)!important}
.page-numbers.current{background:var(--accent);color:#fff!important;border-color:var(--accent)}
.page-numbers.dots{border:none;background:none}

/* ── Post Content ─────────────────────────────────────────── */
.post-content{font-size:1.06rem;line-height:1.88;color:var(--text-b)}
.post-content h1,.post-content h2,.post-content h3,
.post-content h4,.post-content h5,.post-content h6{
  font-weight:800;margin:1.85rem 0 .75rem;line-height:1.25;
  color:var(--text-h);letter-spacing:-.025em}
.post-content h2{font-size:1.55rem;padding-bottom:.45rem;border-bottom:2px solid var(--border)}
.post-content h3{font-size:1.3rem}.post-content h4{font-size:1.12rem}
.post-content p{margin:0 0 1.3rem}
/* Content links DO get underlines */
.post-content a,.post-content a:link,.post-content a:visited{
  color:var(--accent)!important;text-decoration:underline!important;text-underline-offset:3px}
.post-content a:hover{color:var(--accent-dk)!important}
.post-content img{border-radius:var(--r);height:auto;max-width:100%;margin:1.1rem auto}
.post-content ul,.post-content ol{margin:1rem 0 1.3rem 1.5rem}
.post-content ul{list-style:disc}.post-content ol{list-style:decimal}
.post-content li{margin-bottom:.4rem;line-height:1.75}
.post-content blockquote{border-left:4px solid var(--accent);padding:1rem 1.4rem;
  margin:1.75rem 0;background:#fafaf8;border-radius:0 var(--r) var(--r) 0;
  font-style:italic;color:#4b5563;font-size:1.05rem}
.post-content blockquote p{margin:0}
.post-content table{width:100%;border-collapse:collapse;margin:1.4rem 0;font-size:.94rem}
.post-content th,.post-content td{border:1px solid var(--border);padding:.6rem .85rem;text-align:left}
.post-content th{background:#f9f9f6;font-weight:700;color:var(--text-h)}
.post-content pre{background:#0f172a;color:#e2e8f0;padding:1.25rem;
  border-radius:var(--r);overflow-x:auto;margin:1.4rem 0;font-size:.87rem;line-height:1.7;position:relative}
.post-content code{background:#f1f5f9;color:var(--accent);padding:.15rem .42rem;
  border-radius:4px;font-size:.87em;font-family:'Courier New',monospace}
.post-content pre code{background:none;color:inherit;padding:0}
.post-content hr{border:none;border-top:2px solid var(--border);margin:2rem 0}

/* ── WP Alignment ─────────────────────────────────────────── */
.alignleft{float:left;margin:0 1.5em 1em 0}
.alignright{float:right;margin:0 0 1em 1.5em}
.aligncenter{display:block;margin:0 auto 1em}
.alignwide{margin-left:-2rem;margin-right:-2rem;max-width:calc(100% + 4rem)}
.wp-caption-text{font-size:.78rem;color:var(--text-m);text-align:center;margin:.3rem 0 0;font-style:italic}

/* ── Footer Widgets ───────────────────────────────────────── */
#footer-widgets .widget-title{font-size:.7rem!important;font-weight:800!important;
  letter-spacing:.12em!important;text-transform:uppercase!important;color:#fff!important;
  padding-bottom:.5rem!important;border-bottom:2px solid var(--accent)!important;margin-bottom:.8rem!important}
#footer-widgets .widget ul{list-style:none;padding:0;margin:0}
#footer-widgets .widget ul li{border-bottom:1px solid rgba(255,255,255,.06);padding:.32rem 0}
#footer-widgets .widget ul li a,#footer-widgets .widget a{
  color:#64748b;font-size:.84rem;text-decoration:none!important;transition:color .15s}
#footer-widgets .widget ul li a:hover,#footer-widgets .widget a:hover{color:#fff}
#footer-widgets .widget p{color:#64748b;font-size:.84rem;line-height:1.7;margin:0}
footer a,footer a:link,footer a:visited,footer a:hover{text-decoration:none!important}

/* ── Ads ──────────────────────────────────────────────────── */
.ad-wrap{text-align:center;overflow:hidden;clear:both;max-width:100%}
.ad-label{font-size:.6rem;color:#ccc;text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px}
#tns-slot-a,#tns-slot-b{width:100%;max-width:100%;overflow:hidden;text-align:center;box-sizing:border-box}
.adsbygoogle{max-width:100%!important}
[id^="div-gpt-ad"]{min-width:0!important;max-width:100%!important;overflow:hidden!important}

/* ── Read More ────────────────────────────────────────────── */
a.more-link,.read-more,.readmore,.read-more-btn,.adinserter-read-more a{
  display:inline-flex!important;align-items:center!important;
  padding:.55rem 1.35rem!important;background:var(--accent)!important;
  color:#fff!important;font-size:.88rem!important;font-weight:700!important;
  border-radius:6px!important;text-decoration:none!important;
  border:none!important;cursor:pointer!important;transition:opacity .18s!important;margin-top:.75rem!important}
a.more-link:hover{opacity:.85!important}

/* ── Global headings + misc ────────────────────────────────── */
h1,h2,h3,h4,h5,h6{font-family:'Inter','Segoe UI',system-ui,sans-serif;font-weight:700;color:var(--text-h)}
h1 a,h2 a,h3 a,h4 a{color:inherit!important;text-decoration:none!important}
h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover{color:var(--accent)!important}
.meta a{color:inherit!important;text-decoration:none!important}
.meta a:hover{color:var(--accent)!important}
nav a{text-decoration:none!important}

/* ── Gutenberg ────────────────────────────────────────────── */
.wp-block-image img{border-radius:var(--r)}
.wp-block-quote{border-left:4px solid var(--accent)}
.wp-block-button__link{background:var(--accent)!important;color:#fff!important;
  text-decoration:none!important;border-radius:6px!important}

/* ══════════════════════════════════════════════════════════
   MOBILE — Equal left & right padding, zero overflow
   ══════════════════════════════════════════════════════════ */
@media(max-width:767px){
  /* Symmetric padding on ALL containers */
  .site-main,main,.logo-row-inner,#site-header>div,
  footer .footer-cols,footer>div{
    padding-left:1rem!important;padding-right:1rem!important}

  /* Hero: show only first post as block */
  .hero-grid{display:block!important;height:auto!important;overflow:hidden!important}
  .hero-grid>*{display:none!important}
  .hero-grid>*:first-child{
    display:block!important;height:260px!important;width:100%!important;
    border-radius:var(--r)!important;overflow:hidden!important;margin-bottom:1rem!important}

  /* All main grids → stacked */
  .main-grid,.single-grid,.cat-page-wrap,.srch-wrap,.auth-wrap,.page-wrap{display:block!important}
  .main-grid>aside,.single-grid>aside,.cat-page-wrap>aside{display:block!important;margin-top:1.5rem}
  aside{position:static!important;top:auto!important}

  /* 3-col → 2-col */
  .posts-3col,.cat-3col,.auth-3col,.related-grid{grid-template-columns:1fr 1fr!important}
  .cat-sec-grid{display:block!important}
  .cat-sec-grid>article{margin-bottom:.75rem}

  /* Footer: stack */
  .footer-cols{display:block!important}
  .footer-cols>div{margin-bottom:1.75rem}

  /* Ads: contained */
  .ad-wrap,[id^="div-gpt-ad"]{max-width:100%!important;overflow:hidden!important}
  #tns-slot-a,#tns-slot-b{padding:.4rem .85rem!important}

  /* Typography */
  h1{font-size:1.5rem!important}
  .hero-post h2{font-size:1.15rem!important}
  .post-content{font-size:1rem!important}
}

@media(max-width:480px){
  .posts-3col,.cat-3col,.auth-3col,.related-grid{grid-template-columns:1fr!important}
}

/* Ad slot visibility controlled by scoped <style> output from functions.php */