/*
Theme Name: Sam Superfast
Theme URI: https://example.com/
Author: You
Description: Ultra-lean, super fast blog theme. Blog layout toggles between sam (list) and sam2 (stack). Single post styled per design.
Version: 0.1.0
Text Domain: sam
*/

/* Base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  background: #f7f7f7;
  color: #333;
  line-height: 1.5;
}
body.use-poppins { font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
a { color: var(--sam-accent); text-decoration: none; }
a:hover { text-decoration: none !important; }
img { max-width: 100%; height: auto; display: block; }

/* Layout */
.main-container { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0; }
@media (min-width: 768px){ .main-container { width: auto; padding: 0 1rem; } }
header.site-header { background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.06); }
.site-header-inner { position:relative; display:flex; align-items:center; justify-content:space-between; padding: 0.75rem 0; }
.logo { font-weight: 700; font-size: 2rem; color: var(--sam-accent); }
.logo span { display:block; font-size: .8rem; color:#666; letter-spacing:.2em; text-transform:uppercase; margin-top:-.35rem; }

/* Logo image sizing */
.custom-logo { max-height: 72px; height:auto; width:auto; }
@media (min-width:768px){ .custom-logo{ max-height: 96px; } }

.nav-toggle { background:none; border:0; padding:.25rem; display:inline-flex; align-items:center; justify-content:center; color:#333; }
@media (min-width:768px){ .nav-toggle{ display:none; } }

/* Center logo on mobile */
@media (max-width: 767px){ .site-header .logo{ margin: 0 auto; } .nav-toggle{ position:absolute; right:0; left:auto; top:50%; transform:translateY(-50%);} }

.primary-nav { position:absolute; left:0; right:0; top:100%; display:none; flex-direction:column; gap:.5rem; background:#fff; border-top:1px solid #eee; padding:.75rem 1rem; z-index:100; text-align:center; }
.primary-nav li { list-style: none; margin:0; padding:0; position:relative; }
.primary-nav a { color:#555; display:block; padding:.25rem 0; font-size: 1.125rem; }
.primary-nav a:hover { color:var(--sam-accent); }
.nav-open .primary-nav { display:block; }
/* Show nested submenus expanded on mobile */
@media (max-width: 767px){
  /* Mobile: submenus toggle open/closed */
  .primary-nav .sub-menu { display:none; position:static; border:0; box-shadow:none; padding-left:1rem; margin-top:.25rem; }
  .primary-nav li.open > .sub-menu { display:block; }
  /* Put chevron next to text */
  .primary-nav a { display:inline-block; }
  .submenu-toggle { background:none; border:0; margin-left:.35rem; color:#555; vertical-align:middle; padding:.1rem; }
}
@media (min-width:768px){
  .primary-nav{ position:static; display:flex; flex-direction:row; gap:1.25rem; border:0; padding:0; }
  .primary-nav .menu { display:flex; gap:1.25rem; justify-content:center; margin:0 auto; }
  .primary-nav .sub-menu { position:absolute; display:none; top:100%; left:0; background:#fff; border:1px solid #eee; border-radius:.375rem; box-shadow:0 10px 20px rgba(0,0,0,.06); padding:.5rem .75rem; min-width: 180px; }
  .primary-nav li:hover > .sub-menu { display:block; }
  .primary-nav .sub-menu li { white-space:nowrap; }
}
/* Default header: force nav centered in the header row on desktop */
@media (min-width:768px){
  .site-header .primary-nav { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); }
}

.content-grid { display:grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 1024px){ .content-grid{ grid-template-columns: 2fr 1fr; } }

/* Sidebar widgets */
.widget { background:#fff; border-radius: .5rem; box-shadow: 0 1px 4px rgba(0,0,0,.06); padding:1.25rem; }
.widget-title { font-size: 1.125rem; font-weight: 600; margin: 0 0 .75rem; }
.widget.about { background:#fffbe6; border:1px solid #fde68a; color:#555; }
.widget .media { display:flex; gap:.75rem; align-items:flex-start; }
.widget .media img { width: 96px; height: 96px; object-fit:cover; border-radius:.375rem; }
.widget .media .meta { font-size:.875rem; color:#666; }

/* Post list cards */
.posts { display:flex; flex-direction:column; gap: 1rem; }
.post-card { background:#fff; border-radius:.5rem; box-shadow: 0 1px 4px rgba(0,0,0,.06); overflow:hidden; padding:1.25rem; display:flex; flex-direction:column; gap: .75rem; }
.post-card h2 { font-size: 1.25rem; color: var(--sam-accent); margin:0; font-weight:700; }
.post-card .meta { font-size:.875rem; color:#666; }
.post-card .excerpt { color:#555; }
.post-card .author-box { background:#f5f5f5; padding:.625rem; border-radius:.375rem; color:#444; }
.post-card .author-name { color: var(--sam-accent); font-weight:500; font-size:.9rem; margin:.25rem 0 0; }

/* Horizontal variant (sam) */
.post-card.list { flex-direction: row; }
.post-card.list .thumb { width: 33%; min-width: 220px; }
.post-card.list .thumb img { width:100%; height:100%; object-fit:cover; border-radius:.375rem; }
.post-card.list .body { flex:1; padding-left: 1rem; }
@media (max-width: 768px){ .post-card.list{ flex-direction:column; } .post-card.list .body{ padding-left:0; } .post-card.list .thumb{ width:100%; min-width:auto; } }

/* Stacked variant (sam2) */
.post-card.stack .thumb { width:100%; }
.post-card.stack .thumb img { border-radius:.375rem; }

/* Single post */
.single-wrap { display:grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 1024px){ .single-wrap{ grid-template-columns: 2fr 1fr; } }
.single-article { background:#fff; border-radius:.5rem; box-shadow: 0 1px 4px rgba(0,0,0,.06); padding:1.25rem; }
.single-title { font-size: 2rem; line-height:1.2; margin: 0 0 .5rem; font-weight:700; }
.single-title { color: var(--sam-accent); }
.single-meta { font-size:.9rem; color:#666; margin-bottom:1rem; }
.single-content { color:#333; }
.article_credit:empty { display: none; }
.single-content h2, .single-content h3 { margin-top:1.25rem; color:#111; }
.single-content p { margin: 0 0 1rem; }
.single-content .promo { background:#fff5f5; border:1px solid #fecaca; padding:1rem; border-radius:.5rem; }

/* Footer */
footer.site-footer { padding:2rem 0; color:#666; font-size:.9rem; text-align:center; }

/* Ad slots (CLS-safe placeholders) */
.ad-slot { display:block; width:100%; background:transparent; }
.ad-slot .ad-inner { width:100%; height:100%; }
/* Below menu bar: 60px mobile, 90px desktop */
.ad-slot.ad-below-menu { min-height: 60px; margin: .5rem 0 1rem; }
@media (min-width: 1024px){ .ad-slot.ad-below-menu { min-height: 90px; } }
/* In-content default: 300x250 mobile, 336x280 desktop */
.ad-slot.ad-incontent { min-height: 250px; margin: 1rem 0; }
@media (min-width: 768px){ .ad-slot.ad-incontent { min-height: 280px; } }
/* Sidebar top: 300x250 mobile, 300x600 desktop */
.ad-slot.ad-sidebar-top { min-height: 250px; margin: 0 0 1rem; }
@media (min-width: 1024px){ .ad-slot.ad-sidebar-top { min-height: 600px; } }
/* Anchor (fixed footer bottom): 50-60px mobile, 90px desktop */
.ad-slot.ad-anchor { position: fixed; left:0; right:0; bottom:0; z-index: 9999; background:#fff; border-top: 1px solid #eee; min-height: 56px; }
@media (min-width: 1024px){ .ad-slot.ad-anchor { min-height: 90px; } }
/* Add bottom padding to prevent content from being overlapped by anchor ad; apply via body class if needed */
body.has-anchor-ad main { padding-bottom: 72px; }
@media (min-width:1024px){ body.has-anchor-ad main { padding-bottom: 100px; } }

/* Tailwind override: use accent for elements with text-red-600 */
.text-red-600 { color: var(--sam-accent) !important; }

/* Menu list markers off */
nav.primary-nav li { list-style: none; }

/* Feature area category badge */
.sam-feature-badge { background: var(--sam-feature-badge-bg, #2ab391); color: var(--sam-feature-badge-color, #fff); padding:2px 8px; border-radius:4px; font-size:11px; letter-spacing:.05em; }

/* Utility: 90% height on md+ */
@media (min-width:768px){ .h-md-90p{ height:90%; } }

/* List layout thumbnail wrapper: consistent sizing */
.list-thumb-wrap{ position:relative; width:100%; height:12rem; border-radius:.375rem; overflow:hidden; }
@media (min-width:768px){ .list-thumb-wrap{ height:90%; } }
.list-thumb-wrap .list-thumb-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* Pagination: standardized, accessible, accent-aware */
nav .nav-links, nav.pagination .nav-links, .pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: .375rem;
}

/* ===== Semantic classes to reduce Tailwind chains ===== */
/* Header (sam3) */
.sam-topbar-row{ display:grid; grid-template-columns:repeat(3,1fr); align-items:center; padding:1rem 0; }
.sam-topbar-left{ display:flex; align-items:center; gap:.75rem; color:#6b7280; }
.sam-topbar-logo{ display:flex; flex-direction:column; align-items:center; text-align:center; justify-self:center; }
.sam-topbar-right{ display:flex; align-items:center; gap:.5rem; justify-content:flex-end; }
.sam-icon-btn{ display:inline-flex; align-items:center; justify-content:center; padding:.5rem; border:1px solid #d1d5db; border-radius:.375rem; color:#374151; background:#fff; }
.sam-icon-btn:hover{ background:#f9fafb; }
.sam-primary-menu{ display:flex; justify-content:center; gap:1.5rem; padding:.75rem 0; font-size:1rem; }
@media (min-width:768px){ .sam-primary-menu{ font-size:1.25rem; } }

/* Feature area grid (sam3) */
.sam-feature-grid{ display:grid; grid-template-columns:1fr; gap:1.5rem; }
@media (min-width:768px){ .sam-feature-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .sam-feature-grid{ grid-template-columns:repeat(3,1fr); } }
.sam-feature-col-left, .sam-feature-col-right{ display:flex; flex-direction:column; gap:1.5rem; }
.sam-feature-col-left{ order:2; }
.sam-feature-col-center{ order:1; }
.sam-feature-col-right{ order:3; }
@media (min-width:768px){ .sam-feature-col-left{ order:1; } .sam-feature-col-center{ order:2; } }

/* Footer semantic classes */
.sam-footer-1{ background:#fff; border-top:1px solid #e5e7eb; color:#374151; }
.sam-footer-1 .sam-footer-container{ max-width:1180px; margin:0 auto; padding: 2.5rem 1rem; }
.sam-footer-1 .sam-footer-columns{ display:grid; grid-template-columns:1fr; gap:2rem; }
@media (min-width:768px){ .sam-footer-1 .sam-footer-columns{ grid-template-columns: repeat(4, 1fr); } }
.sam-footer-brand{ display:flex; flex-direction:column; gap:.75rem; }
.sam-footer-brand .sam-footer-logo{ display:flex; align-items:center; gap:.5rem; }
.sam-footer-list{ margin-top:1rem; list-style:none; padding:0; }
.sam-footer-list li{ margin:.4rem 0; }
.sam-footer-list a{ color:#6b7280; text-decoration:none; }
.sam-footer-list a:hover{ color: var(--sam-accent); }
.sam-footer-bottom{ border-top:1px solid #e5e7eb; }
.sam-footer-bottom-inner{ max-width:1180px; margin:0 auto; padding:1rem; display:flex; flex-direction:column; gap:.75rem; align-items:center; justify-content:space-between; font-size:.75rem; color:#6b7280; }
@media (min-width:768px){ .sam-footer-bottom-inner{ flex-direction:row; } }

.sam-footer-2{ background:#0a0a0a; color:#e5e5e5; }
.sam-footer-2 .sam-footer-container{ max-width:1180px; margin:0 auto; padding: 3rem 1rem; }
.sam-footer-2 .sam-footer-columns{ display:grid; grid-template-columns:1fr; gap:2.5rem; align-items:start; }
@media (min-width:768px){ .sam-footer-2 .sam-footer-columns{ grid-template-columns: repeat(5, 1fr); } }
.sam-col-span-2{ }
@media (min-width:768px){ .sam-footer-2 .sam-col-span-2{ grid-column: span 2; } }
.sam-footer-2 h3{ color:#fff; font-size:.9rem; font-weight:600; margin:0; }
.sam-footer-2 .sam-footer-list{ color:#a3a3a3; }
.sam-footer-2 .sam-footer-list a{ color:#a3a3a3; }
.sam-footer-2 .sam-footer-list a:hover{ color:#fff; }
.sam-footer-2 .sam-footer-bottom{ border-top:1px solid #1f2937; margin-top:2rem; }
.sam-footer-2 .sam-footer-bottom-inner{ max-width:1180px; margin:0 auto; padding:1.25rem 1rem; display:flex; flex-direction:column; gap:1rem; align-items:center; justify-content:space-between; }
@media (min-width:768px){ .sam-footer-2 .sam-footer-bottom-inner{ flex-direction:row; } }
nav .page-numbers, .pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 .6rem;
  border: 1px solid #e5e7eb; /* gray-200 */
  background: #fff;
  color: #555;
  border-radius: .5rem;
  text-decoration: none;
  font-weight: 500;
  line-height: 1;
}
nav .page-numbers:hover, .pagination .page-numbers:hover {
  border-color: var(--sam-accent);
  color: var(--sam-accent);
}
nav .page-numbers.current, .pagination .page-numbers.current {
  background: var(--sam-accent);
  color: #fff;
  border-color: var(--sam-accent);
}
nav .page-numbers:focus, .pagination .page-numbers:focus { outline: none; box-shadow: 0 0 0 2px rgba(0,0,0,.04), 0 0 0 4px rgba(209,42,42,.15); }
/* Prev/Next compact */
nav .page-numbers.prev, nav .page-numbers.next, .pagination .page-numbers.prev, .pagination .page-numbers.next {
  padding: 0 .75rem;
}

/* Share bar */
.sam-share{ display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
.sam-share-btn{ display:inline-flex; align-items:center; justify-content:center; width:2.25rem; height:2.25rem; border:0; border-radius:.5rem; color:#fff; background:#6b7280; text-decoration:none; }
.sam-share-btn:hover{ filter: brightness(1.05); }
.sam-share-btn:focus{ outline: none; box-shadow: 0 0 0 2px rgba(0,0,0,.04), 0 0 0 4px rgba(209,42,42,.15); }
.sam-share .only-mobile{ display:none; }
@media (max-width:767px){ .sam-share .only-mobile{ display:inline-flex; } }
/* Brand colors */
.sam-share-btn--facebook{ background:#1877F2; }
.sam-share-btn--x{ background:#000; }
.sam-share-btn--pinterest{ background:#E60023; }
.sam-share-btn--linkedin{ background:#0A66C2; }
.sam-share-btn--whatsapp{ background:#25D366; }
.sam-share-btn--copy{ background:#4b5563; }
.sam-share-btn--native{ background:#10b981; color:#111; }

/* sam3 layout fallback grids (ensures columns even if Tailwind misses purge) */
.sam3-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 768px){ .sam3-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px){ .sam3-grid { grid-template-columns: repeat(3, 1fr); } }

.sam3-grid-4 { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 1024px){ .sam3-grid-4 { grid-template-columns: repeat(4, 1fr); } }

.sam3-split { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 1024px){ .sam3-split { grid-template-columns: 2fr 1fr; } }

/* sam3 header tweaks */
.header-sam3 .sam3-topbar .font-extrabold { letter-spacing: 0.02em; }
.header-sam3 .primary-nav { position: static; background: transparent; border: 0; padding: 0; }
.header-sam3 .primary-nav .sam3-menu { display:flex; justify-content:center; gap: 1.5rem; padding: .75rem 0; font-size: .875rem; margin: 0; }
.header-sam3 .primary-nav .sam3-menu > li { list-style: none; }
.header-sam3 .primary-nav .sam3-menu a { color:#555; }
.header-sam3 .primary-nav .sam3-menu a:hover { color: var(--sam-accent); }
.header-sam3 .primary-nav .sub-menu { display: none; }

/* sam3 topbar nav to match provided structure */
.container-max { max-width: 1180px; }
.header-sam3 nav .sam3-menu { list-style:none; margin:0; padding:0; display:flex; gap:1.25rem; justify-content:center; }
.header-sam3 nav .sam3-menu > li { position:relative; }
.header-sam3 nav .sam3-menu a { color:#555; }
.header-sam3 nav .sam3-menu a:hover { color: var(--sam-accent); }
@media (min-width:768px){
  .header-sam3 nav .sam3-menu .sub-menu{ position:absolute; left:0; top:100%; background:#fff; border:1px solid #eee; border-radius:.375rem; box-shadow:0 10px 20px rgba(0,0,0,.06); padding:.5rem .75rem; display:none; min-width:180px; z-index:1000; }
  .header-sam3 nav .sam3-menu li:hover > .sub-menu{ display:block; }
  .header-sam3 nav .sam3-menu .sub-menu li{ white-space:nowrap; }
}
@media (max-width:767px){
  #sam3-primary-menu{ position:fixed; top:0; left:0; bottom:0; width:85%; max-width:340px; background:#fff; padding:1rem; transform:translate3d(-100%,0,0); transition:transform .28s cubic-bezier(.4,0,.2,1); will-change: transform; z-index:1001; overflow:auto; backface-visibility:hidden; }
  body.sam3-nav-open #sam3-primary-menu{ transform:translate3d(0,0,0); }
  #sam3-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:1000; opacity:0; transition:opacity .28s cubic-bezier(.4,0,.2,1); pointer-events:none; will-change: opacity; }
  #sam3-overlay.is-open{ opacity:1; pointer-events:auto; }
  .header-sam3 nav .sam3-menu{ display:block; }
  .header-sam3 nav .sam3-menu > li{ position:relative; margin:0; border-bottom:1px solid #eee; }
  .header-sam3 nav .sam3-menu > li:last-child{ border-bottom:0; }
  /* Keep link block for better tap area; reserve space for chevron */
  .header-sam3 nav .sam3-menu > li > a{ display:block; padding:.6rem 34px .6rem 0; }
  .header-sam3 nav .sam3-menu li.menu-item-has-children > a{ padding-right:34px; }
  /* Place chevron absolutely to the right; fixed top so it doesn't shift when submenu opens */
  .header-sam3 nav .sam3-menu .submenu-toggle{ position:absolute; right:.25rem; top:.85rem; background:none; border:0; color:#555; padding:.25rem; display:inline-flex; align-items:center; }
  .header-sam3 nav .sam3-menu .submenu-toggle svg{ transition: transform .2s ease; transform-origin: 50% 50%; }
  .header-sam3 nav .sam3-menu li.open > .submenu-toggle svg{ transform: rotate(90deg); }
  .header-sam3 nav .sam3-menu .sub-menu{ position:static; display:none; border:0; box-shadow:none; padding-left:1rem; }
  .header-sam3 nav .sam3-menu .sub-menu a{ color: var(--sam-accent); display:block; padding:.5rem 0; }
  .header-sam3 nav .sam3-menu li.open > .sub-menu{ display:block; }
}

/* Use box-shadow for nav borders to avoid CLS (no layout impact) */
.header-sam3 nav.sam3-nav-lined{ box-shadow: inset 0 -1px #eee, inset 0 1px #eee; min-height: 48px; display:block; }
@media (min-width:768px){ .header-sam3 nav.sam3-nav-lined{ min-height: 56px; } }
/* Stabilize menu line-height to avoid font metric shifts */
.header-sam3 nav .sam3-menu a{ line-height: 1.3; }

/* sam3 mobile nav toggle */
@media (max-width: 767px){
  #sam3-primary-menu { display:none; }
  body.sam3-nav-open #sam3-primary-menu { display:block; }
  body.sam3-nav-open #sam3-primary-menu a { display:block; padding:.5rem 0; text-align:center; }
}

/* Search overlay */
#sam3-search-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:1100; display:none; opacity:0; transition:opacity .2s ease; }
#sam3-search-overlay.is-open{ display:block; opacity:1; }
#sam3-search-panel{ position:absolute; left:50%; top:8%; transform:translateX(-50%); width:92%; max-width:760px; background:#fff; border-radius:.5rem; box-shadow:0 10px 30px rgba(0,0,0,.2); }
#sam3-search-panel .head{ display:flex; align-items:center; gap:.5rem; padding:.75rem 1rem; border-bottom:1px solid #eee; }
#sam3-search-panel .head input{ flex:1; font-size:1rem; padding:.6rem .75rem; border:1px solid #ddd; border-radius:.375rem; }
#sam3-search-panel .head button{ background:#111; color:#fff; border:0; padding:.55rem .8rem; border-radius:.375rem; }
#sam3-search-panel .results{ max-height:60vh; overflow:auto; padding: .75rem 1rem 1rem; }
#sam3-search-panel .results a{ display:block; padding:.5rem 0; color:#333; }
#sam3-search-panel .results a:hover{ color: var(--sam-accent); }

/* Subscribe overlay */
#sam3-sub-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:1100; display:none; opacity:0; transition:opacity .2s ease; }
#sam3-sub-overlay.is-open{ display:block; opacity:1; }
#sam3-sub-panel{ position:absolute; left:50%; top:10%; transform:translateX(-50%); width:92%; max-width:560px; background:#fff; border-radius:.5rem; box-shadow:0 10px 30px rgba(0,0,0,.2); }
#sam3-sub-panel .head{ padding:.9rem 1rem; border-bottom:1px solid #eee; font-weight:600; display:flex; justify-content:space-between; align-items:center; }
#sam3-sub-panel .body{ padding:1rem; }
#sam3-sub-panel label{ display:block; font-size:.9rem; margin:.25rem 0 .25rem; }
#sam3-sub-panel input[type="text"], #sam3-sub-panel input[type="email"]{ width:100%; font-size:1rem; padding:.6rem .75rem; border:1px solid #ddd; border-radius:.375rem; }
#sam3-sub-panel .actions{ display:flex; gap:.5rem; align-items:center; margin-top:.75rem; }
#sam3-sub-panel .btn{ background:var(--sam-accent); color:#fff; border:0; padding:.55rem .9rem; border-radius:.375rem; cursor:pointer; }
#sam3-sub-panel .muted{ color:#666; font-size:.85rem; }
#sam3-sub-panel .close{ background:#111; color:#fff; border:0; padding:.4rem .6rem; border-radius:.375rem; }
#sam3-sub-msg{ margin-top:.5rem; font-size:.9rem; }
