/*
Theme Name: Inspizy Magazine
Theme URI: https://newspaperwp.local
Author: Inspizy Devs
Description: Fully custom news-portal theme for Inspizy Devs Magazine. Category-driven homepage, subcategory-aware archives, tag support, post shortcodes.
Version: 1.1.9
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: inspizy-magazine
*/

:root{
  --saffron:#E8720C;
  --saffron-deep:#C25A00;
  --green:#0C7C59;
  --navy:#0B2545;
  --cream:#FBF6EE;
  --red:#C81E1E;
  --ink:#1C1C1C;
  --line:#e8e1d3;
  --ticker:#7A1414;
}

*, *::before, *::after { box-sizing: border-box; }

body{
  margin:0;
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--cream);
  color:var(--ink);
  line-height:1.55;
}

a{ text-decoration:none; color:inherit; }
a:hover{ text-decoration:none; }
img{ max-width:100%; height:auto; display:block; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4{ font-family:'Lora',serif; margin:0; }
.screen-reader-text{ position:absolute; left:-9999px; }

.container{ width:94%; max-width:1360px; margin:auto; }

/* ============ TOP BAR ============ */
.topbar{
  background:var(--navy);
  color:#fff;
  font-size:12.5px;
  padding:7px 0;
  border-bottom:3px solid var(--saffron);
}
.topbar .container{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:6px; }
.topbar-left, .topbar-right{ display:flex; gap:16px; align-items:center; }
.topbar a:hover{ color:var(--saffron); }
.lang-switcher{ display:flex; gap:10px; align-items:center; }
.lang-switcher a{ opacity:.75; }
.lang-switcher a.is-active{ opacity:1; color:var(--saffron); font-weight:600; }

/* ============ HEADER ============ */
.site-header{ background:#fff; padding:16px 0 0; }
.header-inner{ display:flex; justify-content:space-between; align-items:center; padding-bottom:16px; gap:16px; flex-wrap:wrap; }
.site-branding{ display:flex; flex-direction:column; line-height:1; }
.site-title{ font-family:'Lora',serif; font-size:38px; font-weight:700; color:var(--ink); margin:0; }
.site-title a{ color:var(--ink); }
.site-title .accent{ color:var(--saffron); }
.site-description{ font-family:'Poppins',sans-serif; font-size:13px; color:#888; margin-top:4px; }
.custom-logo-link img{ max-height:70px; width:auto; }

.header-actions{ display:flex; align-items:center; gap:18px; }
.search-pill{
  display:flex; align-items:center; border:1.5px solid var(--line);
  border-radius:22px; padding:8px 16px; gap:8px; color:#888; font-size:14px;
  background:none;
}
.search-pill button{ background:none; border:none; padding:0; cursor:pointer; font-size:15px; color:#888; line-height:1; }
.search-pill input{ border:none; outline:none; background:none; font-family:inherit; font-size:14px; color:var(--ink); width:220px; max-width:100%; }
.search-pill input::placeholder{ color:#888; }
.livetv-btn{
  display:flex; align-items:center; gap:7px; background:var(--red); color:#fff;
  padding:9px 16px; border-radius:22px; font-weight:600; font-size:14px;
}
.livetv-btn .dot{ width:8px; height:8px; border-radius:50%; background:#fff; animation:blink 1.4s infinite; }
@keyframes blink{ 50%{ opacity:.25; } }

.menu-toggle{
  display:none; background:none; border:1px solid var(--line); border-radius:4px;
  padding:8px 12px; font-size:18px; cursor:pointer;
}

/* ============ NAV ============ */
.main-navigation{ background:var(--navy); }
.primary-navigation ul{ display:flex; gap:2px; flex-wrap:wrap; }
.primary-navigation a{
  display:block; color:#fff; font-size:14.5px; font-weight:500;
  padding:13px 18px; border-right:1px solid rgba(255,255,255,.08);
}
.primary-navigation li:first-child a{ background:var(--saffron); font-weight:600; }
.primary-navigation a:hover{ background:rgba(255,255,255,.1); }
.primary-navigation .current-menu-item > a,
.primary-navigation .current-menu-parent > a,
.primary-navigation .current-menu-ancestor > a,
.primary-navigation .current-category-parent > a,
.primary-navigation .current-category-ancestor > a{ background:var(--saffron); font-weight:600; }

/* dropdown submenus (e.g. state -> district) */
.primary-navigation li{ position:relative; }
.primary-navigation .menu-item-has-children > a::after{ content:'\25BE'; margin-left:6px; font-size:.7em; vertical-align:middle; }
.primary-navigation ul.sub-menu{
  display:none; position:absolute; top:100%; left:0; z-index:50;
  flex-direction:column; flex-wrap:nowrap; gap:0;
  min-width:240px; max-height:70vh; overflow-y:auto;
  background:var(--navy); box-shadow:0 10px 24px rgba(0,0,0,.3);
}
.primary-navigation li:hover > ul.sub-menu,
.primary-navigation li:focus-within > ul.sub-menu{ display:flex; }
.primary-navigation ul.sub-menu a{ border-right:none; border-bottom:1px solid rgba(255,255,255,.08); white-space:nowrap; }
.primary-navigation li:first-child ul.sub-menu a{ background:var(--navy); font-weight:500; }
.submenu-toggle{ display:none; }

/* ============ BREAKING TICKER ============ */
.ticker-row{ display:flex; align-items:stretch; }
.ticker-label{
  background:var(--red); color:#fff; font-weight:700; font-size:13px;
  padding:0 18px; display:flex; align-items:center; white-space:nowrap; letter-spacing:.4px;
}
.ticker{ background:var(--ticker); color:#fff; overflow:hidden; padding:11px 0; font-weight:500; font-size:14px; flex:1; }
.ticker marquee{ width:100%; }
.ticker a{ margin-right:50px; white-space:nowrap; color:#fff; }
.ticker a:hover{ text-decoration:underline; }

/* ============ BREADCRUMBS ============ */
.breadcrumbs{ margin-top:16px; }
.breadcrumbs ol{ list-style:none; display:flex; flex-wrap:wrap; margin:0; padding:0; font-size:12.5px; color:#888; }
.breadcrumbs li{ display:flex; align-items:center; }
.breadcrumbs li:not(:last-child)::after{ content:'/'; margin:0 8px; color:var(--line); }
.breadcrumbs a{ color:#888; }
.breadcrumbs a:hover{ color:var(--saffron-deep); text-decoration:underline; }
.breadcrumbs li[aria-current="page"] span{ color:var(--ink); font-weight:600; }

/* ============ MAIN LAYOUT ============ */
.main-layout{ display:grid; grid-template-columns:1fr 300px; gap:28px; margin-top:28px; padding-bottom:40px; }

/* ============ HERO (slider) ============ */
.hero{ display:grid; grid-template-columns:1.7fr 1fr; gap:16px; margin-bottom:28px; }
.hero-main{ position:relative; overflow:hidden; }
.hero-main .inspizy-slider{ position:relative; }
.hero-main .slider-track{ display:flex; transition:transform .5s ease; }
.hero-main .slider-slide{ min-width:100%; position:relative; }
.hero-main img{ height:430px; width:100%; object-fit:cover; }
.pill-tag{
  display:inline-block; background:var(--saffron); color:#fff; font-size:11.5px;
  font-weight:700; letter-spacing:.5px; padding:4px 10px; margin-bottom:10px; text-transform:uppercase;
}
.hero-overlay{
  position:absolute; left:0; right:0; bottom:0; padding:26px 24px;
  background:linear-gradient(transparent,rgba(5,10,25,.94)); color:#fff;
}
.hero-overlay h1, .hero-overlay h2{ font-size:27px; line-height:1.28; margin-bottom:8px; color:#fff; }
.hero-overlay p{ font-size:13.5px; color:#d8d8d8; }

.hero-side{ display:grid; gap:16px; }
.hero-card{ position:relative; overflow:hidden; }
.hero-card img{ height:129px; width:100%; object-fit:cover; }
.hero-card .cap{ position:absolute; left:0; right:0; bottom:0; padding:10px 12px 8px; background:linear-gradient(transparent,rgba(5,10,25,.9)); }
.hero-card h4{ color:#fff; font-size:14.5px; font-weight:600; line-height:1.3; font-family:'Lora',serif; }
.hero-card .pill-tag{ font-size:10px; padding:2px 7px; margin-bottom:5px; }

/* ============ SLIDER CONTROLS (shared: hero + shortcode slider) ============ */
.inspizy-slider{ position:relative; }
.slider-track{ display:flex; transition:transform .5s ease; }
.slider-slide{ min-width:100%; flex-shrink:0; }
.slider-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  width:38px; height:38px; border-radius:50%; border:none; background:rgba(11,37,69,.75);
  color:#fff; font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.slider-arrow--prev{ left:12px; }
.slider-arrow--next{ right:12px; }
.slider-arrow:hover{ background:var(--saffron); }
.slider-dots{ position:absolute; bottom:12px; right:16px; display:flex; gap:6px; z-index:2; }
.slider-dot{ width:8px; height:8px; border-radius:50%; border:none; background:rgba(255,255,255,.5); cursor:pointer; padding:0; }
.slider-dot.is-active{ background:var(--saffron); }

/* ============ TRENDING ============ */
.trending{
  display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line);
  padding:12px 18px; margin-bottom:26px; flex-wrap:wrap;
}
.trending b{ color:var(--saffron-deep); font-size:13px; white-space:nowrap; font-family:'Poppins',sans-serif; }
.trending a{ font-size:13px; background:var(--cream); padding:5px 12px; border-radius:14px; border:1px solid var(--line); }

/* ============ SECTION ============ */
.section{ background:#fff; padding:24px; margin-bottom:26px; border:1px solid var(--line); }
.section-head{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:20px; border-bottom:2px solid var(--ink); padding-bottom:10px; }
.section-title{ font-size:21px; font-weight:700; position:relative; padding-left:14px; }
.section-title::before{ content:''; position:absolute; left:0; top:3px; bottom:3px; width:5px; background:var(--saffron); }
.section-head a{ font-size:12.5px; color:var(--saffron-deep); font-weight:600; }

/* post grid (Top Stories, shortcode grid) */
.post-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.post-grid--cols-2{ grid-template-columns:repeat(2,1fr); }
.post-grid--cols-4{ grid-template-columns:repeat(4,1fr); }
.post{ border:1px solid var(--line); }
.post img{ width:100%; aspect-ratio:16/10; object-fit:cover; }
.post-content{ padding:14px; }
.post-content h3{ font-size:16.5px; line-height:1.35; margin-bottom:8px; }
.meta{ font-size:11.5px; color:var(--saffron-deep); font-weight:600; text-transform:uppercase; letter-spacing:.4px; margin-bottom:8px; }
.meta span{ color:#999; font-weight:400; text-transform:none; margin-left:6px; }

/* category grid */
.category-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.category-box{ border:1px solid var(--line); padding:20px; }
.category-box h3{ font-size:17px; padding-bottom:10px; margin-bottom:12px; border-bottom:2px solid var(--saffron); display:inline-block; }
.category-box li{ display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px dashed var(--line); font-size:14px; }
.category-box li:last-child{ border-bottom:none; }
.category-box li span{ font-size:11px; color:#999; }

/* video grid */
.video-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.video-card{ position:relative; overflow:hidden; }
.video-card img{ height:100px; width:100%; object-fit:cover; }
.play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.25); }
.play::after{
  content:'\25B6'; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92);
  color:var(--red); display:flex; align-items:center; justify-content:center; font-size:12px; padding-left:2px;
}
.video-card h4{ font-size:12.5px; padding:8px 2px; line-height:1.3; }

/* latest news list (news-list, shortcode list) */
.news-list article{ display:flex; gap:18px; margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.news-list article:last-child{ border:none; margin:0; padding:0; }
.news-list img{ width:200px; height:130px; object-fit:cover; flex-shrink:0; }
.news-list h3{ font-size:17px; margin-bottom:6px; line-height:1.35; }
.news-list p{ font-size:13.5px; color:#555; line-height:1.5; }

/* ============ SIDEBAR ============ */
.sidebar-widget{ background:#fff; padding:20px; margin-bottom:24px; border:1px solid var(--line); }
.footer-grid .widget{ margin-bottom:16px; }
.widget-title{ font-size:17px; font-weight:700; margin-bottom:16px; padding-left:11px; border-left:4px solid var(--saffron); font-family:'Lora',serif; }
.search-box input{ width:100%; padding:11px 14px; border:1.5px solid var(--line); font-family:'Poppins',sans-serif; }

.most-read li{ display:flex; gap:12px; align-items:flex-start; padding:11px 0; border-bottom:1px solid var(--line); font-size:13.5px; line-height:1.4; }
.most-read li:last-child{ border:none; }
.most-read .num{ font-family:'Lora',serif; font-size:22px; font-weight:700; color:var(--line); min-width:26px; }
.most-read li:nth-child(-n+3) .num{ color:var(--saffron); }

.livetv-embed{
  position:relative; background:#000; aspect-ratio:16/9; display:flex; align-items:center;
  justify-content:center; color:#fff; font-size:13px; overflow:hidden; text-align:center; padding:10px;
}
.livetv-embed .badge{
  position:absolute; top:10px; left:10px; background:var(--red); padding:3px 9px;
  font-size:10.5px; font-weight:700; border-radius:2px; display:flex; align-items:center; gap:5px;
}
.livetv-embed .badge .dot{ width:6px; height:6px; border-radius:50%; background:#fff; animation:blink 1.4s infinite; }

.ad{
  height:250px; background:repeating-linear-gradient(45deg,#eee,#eee 10px,#e4e4e4 10px,#e4e4e4 20px);
  display:flex; align-items:center; justify-content:center; font-weight:600; color:#999; font-size:13px;
}

/* ============ FOOTER ============ */
.site-footer{ background:var(--navy); color:#cfd7e6; margin-top:10px; padding:50px 0 0; border-top:5px solid var(--saffron); }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:30px; padding-bottom:36px; }
.footer-grid h3{ color:#fff; font-size:16px; margin-bottom:16px; font-family:'Lora',serif; }
.footer-grid p{ font-size:13px; line-height:1.6; }
.footer-grid li{ margin-bottom:9px; font-size:13.5px; }
.footer-grid a:hover{ color:var(--saffron); }
.social-row{ display:flex; gap:10px; margin-top:14px; }
.social-row a{ width:32px; height:32px; border-radius:50%; border:1px solid rgba(255,255,255,.3); display:flex; align-items:center; justify-content:center; font-size:13px; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.12); padding:18px 0; text-align:center; font-size:12.5px; color:#8fa1c4; }

/* ============ SINGLE POST ============ */
.post-article{ background:#fff; border:1px solid var(--line); padding:28px; }
.post-article .entry-header{ margin-bottom:20px; }
.post-article .entry-title{ font-size:2.1rem; font-weight:700; line-height:1.25; margin:10px 0; }
.entry-meta{ font-size:.85rem; color:#777; }
.entry-meta a{ color:#777; }
.post-article .entry-thumbnail{ margin:22px 0; border-radius:12px; overflow:hidden; background:var(--cream); text-align:center; }
.post-article .entry-thumbnail img{ max-height:450px; width:auto; max-width:100%; object-fit:contain; display:inline-block; }
.post-article .entry-content{ font-size:1.08rem; }
.post-article .entry-content p{ margin:0 0 1.2em; }
.post-article .entry-content img{ border-radius:8px; margin:1em 0; }
.entry-tags{ margin-top:30px; padding-top:20px; border-top:1px solid var(--line); }
.entry-tags a{ display:inline-block; background:var(--cream); padding:4px 12px; border-radius:14px; margin:0 6px 6px 0; font-size:.8rem; border:1px solid var(--line); }
.related-posts{ margin-top:40px; padding-top:30px; border-top:1px solid var(--line); }

/* ============ COMMENTS ============ */
.comments-area{ margin-top:40px; padding-top:30px; border-top:1px solid var(--line); }
.comments-area .section-heading{ font-size:21px; font-weight:700; position:relative; padding-left:14px; margin:0 0 22px; }
.comments-area .section-heading::before{ content:''; position:absolute; left:0; top:3px; bottom:3px; width:5px; background:var(--saffron); }

.comment-list{ list-style:none; margin:0 0 34px; padding:0; }
.comment-list .children{ list-style:none; margin:16px 0 0; padding:0 0 0 30px; border-left:2px solid var(--line); }
.comment-list > li + li{ margin-top:16px; }
.comment-list .children > li + li{ margin-top:16px; }

.comment-body{ background:var(--cream); border:1px solid var(--line); border-radius:10px; padding:18px 20px; }
.comment-author.vcard{ display:flex; align-items:center; gap:10px; }
.comment-author.vcard img.avatar{ width:40px; height:40px; border-radius:50%; display:block; }
.comment-author .fn{ font-style:normal; font-weight:700; font-size:.95rem; color:var(--ink); }
.comment-author .says{ display:none; }
.comment-metadata{ font-size:.78rem; color:#888; margin:2px 0 0 50px; }
.comment-metadata a{ color:#888; }
.comment-metadata .edit-link a{ margin-left:8px; }
.comment-content{ font-size:.95rem; line-height:1.65; color:#333; margin-top:12px; }
.comment-content p{ margin:0 0 1em; }
.comment-content p:last-child{ margin-bottom:0; }
.comment .reply{ margin-top:12px; }
.comment-reply-link{ display:inline-block; font-size:.78rem; font-weight:600; color:var(--saffron-deep); border:1px solid var(--saffron-deep); border-radius:20px; padding:4px 14px; }
.comment-reply-link:hover{ background:var(--saffron-deep); color:#fff; }
.comment-awaiting-moderation{ display:block; margin-top:10px; font-size:.8rem; font-style:italic; color:#a5763a; }
.no-comments{ font-size:.9rem; color:#777; }

.comment-respond{ margin-top:10px; padding-top:26px; }
.comments-area > .comment-respond{ border-top:1px solid var(--line); }
.comment-reply-title{ font-size:19px; font-weight:700; margin:0 0 16px; }
.comment-reply-title small{ margin-left:10px; }
.comment-reply-title small a{ font-size:.7rem; font-weight:500; }
.comment-notes, .logged-in-as{ font-size:.85rem; color:#666; margin:0 0 16px; }
.comment-form p{ margin:0 0 16px; }
.comment-form label{ display:block; font-size:.8rem; font-weight:600; margin-bottom:6px; color:var(--ink); }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{
  width:100%; border:1px solid var(--line); border-radius:8px; padding:11px 14px;
  font-family:inherit; font-size:.92rem; background:#fff; color:var(--ink); transition:border-color .15s;
}
.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus,
.comment-form input[type="url"]:focus,
.comment-form textarea:focus{ outline:none; border-color:var(--saffron-deep); }
.comment-form textarea{ min-height:130px; resize:vertical; }
.comment-form-cookies-consent{ display:flex; align-items:center; gap:8px; }
.comment-form-cookies-consent input{ width:auto; }
.comment-form-cookies-consent label{ margin:0; font-weight:400; color:#666; }
.form-submit{ margin-bottom:0; }
.form-submit .submit{
  background:var(--saffron-deep); color:#fff; border:none; border-radius:24px;
  padding:12px 30px; font-weight:600; font-size:.92rem; cursor:pointer; transition:opacity .15s;
}
.form-submit .submit:hover{ opacity:.9; }

/* ============ PAGE CONTENT / EMPTY STATE ============ */
.content-none{ background:#fff; border:1px solid var(--line); padding:30px; text-align:center; }

/* ============ PAGINATION ============ */
.pagination{ display:flex; gap:10px; margin-top:10px; }
.pagination a, .pagination span{ padding:8px 14px; border:1px solid var(--line); border-radius:4px; font-size:.85rem; background:#fff; }
.pagination .current{ background:var(--navy); color:#fff; border-color:var(--navy); }

/* subcategory chip nav on category archives */
.subcategory-nav{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.subcategory-nav a{ background:#fff; border:1px solid var(--line); padding:6px 14px; border-radius:20px; font-size:.85rem; font-weight:600; }
.subcategory-nav a:hover{ background:var(--saffron); color:#fff; border-color:var(--saffron); }

/* ============ RESPONSIVE ============ */
@media (max-width:992px){
  .main-layout{ grid-template-columns:1fr; }
  .hero{ grid-template-columns:1fr; }
  .post-grid{ grid-template-columns:1fr 1fr; }
  .category-grid{ grid-template-columns:1fr; }
  .video-grid{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:768px){
  .menu-toggle{ display:block; }
  .primary-navigation{ display:none; width:100%; }
  .primary-navigation.is-open{ display:block; }
  .primary-navigation ul{ flex-direction:column; }
  .primary-navigation li{ display:flex; flex-wrap:wrap; align-items:center; }
  .primary-navigation a{ flex:1; border-right:none; border-bottom:1px solid rgba(255,255,255,.08); }
  .primary-navigation .menu-item-has-children > a::after{ display:none; }
  .submenu-toggle{
    display:flex; align-items:center; justify-content:center;
    width:44px; align-self:stretch; background:none; border:none; border-bottom:1px solid rgba(255,255,255,.08);
    color:#fff; font-size:14px; cursor:pointer;
  }
  .submenu-toggle[aria-expanded="true"]{ transform:scaleY(-1); }
  .primary-navigation ul.sub-menu{
    display:none; position:static; box-shadow:none; max-height:none; overflow:visible;
    background:rgba(0,0,0,.15); width:100%;
  }
  .primary-navigation li.submenu-open > ul.sub-menu{ display:flex; }
  .primary-navigation ul.sub-menu a{ padding-left:34px; }
  .post-grid{ grid-template-columns:1fr; }
  .news-list article{ flex-direction:column; }
  .news-list img{ width:100%; height:180px; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .video-grid{ grid-template-columns:1fr; }
  .site-title{ font-size:28px; }
  .post-article{ padding:18px; }
  .post-article .entry-thumbnail img{ max-height:240px; }
  .comment-list .children{ padding-left:16px; }
  .comment-metadata{ margin-left:0; }
}