/*
Theme Name: PartyMoodLab
Theme URI: http://localhost/0000HTML5TEMA/partLABProjesi/PartyLabProje
Author: PartyMoodLab
Author URI: http://localhost/0000HTML5TEMA/partLABProjesi/PartyLabProje
Description: Pinterest-first, editorial WordPress theme for a global party-inspiration website. Converted from the PartyMoodLab HTML5 foundation. Soft Editorial Celebration design system with warm ivory, plum, berry, rose and sage. Includes custom homepage, archive, single, search, page and 404 templates, widgetised sidebar/footer, custom menus and AdSense-ready ad slots.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: partymoodlab
Tags: blog, two-columns, right-sidebar, custom-menu, featured-images, editor-style, translation-ready, full-width-template
*/

/*
 * The full compiled design system lives in assets/css/partymoodlab.css and is
 * enqueued from functions.php. This file only carries the required WordPress
 * theme header plus a few WordPress-specific overrides.
 */

/* --- WordPress core helper classes --- */
.alignnone { margin: 1.5rem 0; }
.aligncenter { display: block; margin: 1.5rem auto; }
.alignright { float: right; margin: 0.5rem 0 1rem 1.5rem; }
.alignleft { float: left; margin: 0.5rem 1.5rem 1rem 0; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 0.85rem; color: #8b4a5a; margin-top: 0.5rem; text-align: center; }
.screen-reader-text {
  border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; word-wrap: normal !important;
}
.sticky, .gallery-caption, .bypostauthor { display: block; }

/* Sticky header that condenses on scroll */
.site-header { position: sticky; top: 0; transition: box-shadow .25s ease; }
.site-header__main,
.desktop-nav__list { transition: min-height .25s ease; }
body.pml-scrolled .site-header { box-shadow: 0 12px 30px -18px rgba(77, 53, 64, 0.55); }
body.pml-scrolled .site-header__main { min-height: 70px; }
body.pml-scrolled .desktop-nav__list { min-height: 40px; }

/* Admin bar keeps the sticky header clear of the WP toolbar */
.admin-bar .site-header { top: 32px; }
@media screen and (max-width: 782px) {
  .admin-bar .site-header { top: 46px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-header,
  .site-header__main,
  .desktop-nav__list { transition: none; }
}

/* Comments */
.comment-list { list-style: none; margin: 0; padding: 0; }
.comment-list .children { list-style: none; margin-left: 1.5rem; }
.comment-body { padding: 1.25rem 0; border-bottom: 1px solid rgba(77,53,64,0.12); }
.comment-author { font-weight: 600; }
.comment-meta { font-size: 0.85rem; color: #8b4a5a; }
.comment-respond { margin-top: 2rem; }
.comment-form label { display: block; font-weight: 600; margin-bottom: 0.35rem; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%; padding: 0.75rem 1rem; border: 1px solid rgba(77,53,64,0.2);
  border-radius: 0.75rem; margin-bottom: 1rem; font: inherit; background: #fff;
}

/* Per-category archive header */
.archive-header { --pml-accent: #8b4a5a; }
.archive-header__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 66px; height: 66px; border-radius: 999px; margin-bottom: 1rem;
  background: var(--pml-accent); color: #fcf9f5; font-size: 1.9rem; line-height: 1;
  box-shadow: 0 10px 24px -12px var(--pml-accent);
}
.archive-header .eyebrow { color: var(--pml-accent); }
.archive-count {
  display: inline-block; margin-top: 0.75rem; padding: 0.3rem 0.85rem;
  border-radius: 999px; background: rgba(77,53,64,0.06); color: #4d3540;
  font-size: 0.85rem; font-weight: 600;
}

/* Archive topic chips (links styled like filter chips) */
.archive-topics { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin: 0.5rem 0 0; }
.archive-topics__label { font-size: 0.85rem; color: #8b4a5a; margin-right: 0.25rem; }
.archive-topics .filter-chip {
  display: inline-flex; align-items: center; padding: 0.45rem 0.95rem; border-radius: 999px;
  border: 1px solid rgba(77,53,64,0.18); background: #fff; color: #4d3540;
  font-size: 0.9rem; text-decoration: none; cursor: pointer; transition: all .15s ease;
}
.archive-topics .filter-chip:hover { border-color: #8b4a5a; color: #8b4a5a; }
.archive-topics .filter-chip.is-active { background: #4d3540; color: #fcf9f5; border-color: #4d3540; }

/* Sidebar: sibling category cards */
.sidebar-cats { display: grid; gap: 0.5rem; }
.sidebar-cat {
  display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0.75rem;
  border-radius: 0.85rem; border: 1px solid rgba(77,53,64,0.10); background: #fff;
  text-decoration: none; color: #4d3540; transition: all .15s ease;
}
.sidebar-cat:hover { border-color: var(--pml-accent, #8b4a5a); transform: translateX(2px); }
.sidebar-cat__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; flex: 0 0 34px; border-radius: 999px;
  background: var(--pml-accent, #8b4a5a); color: #fcf9f5; font-size: 1rem;
}
.sidebar-cat__name { flex: 1; font-weight: 600; font-size: 0.95rem; }
.sidebar-cat__count { color: #aab5a1; font-size: 0.85rem; }

/* Page sidebar: info-page navigation + CTA */
.info-pages { list-style: none; margin: 0; padding: 0; }
.info-pages li { margin: 0; }
.info-pages a {
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
  padding: 0.55rem 0.75rem; border-radius: 0.65rem; text-decoration: none;
  color: #4d3540; transition: background .15s ease, color .15s ease;
}
.info-pages a:hover { background: rgba(77,53,64,0.05); color: #8b4a5a; }
.info-pages li.is-active a { background: #4d3540; color: #fcf9f5; font-weight: 600; }
.info-pages a span { color: #aab5a1; }
.info-pages li.is-active a span { color: #f4e5de; }
.sidebar-cta .social-links { margin-top: 0.75rem; }
.sidebar-cta p a { color: #8b4a5a; }

/* Single sidebar: sticky table of contents */
.sidebar-toc { counter-reset: pml-toc; }
.sidebar-toc__list { list-style: none; margin: 0; padding: 0; }
.sidebar-toc__list li { margin: 0; }
.sidebar-toc__list a {
  display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
  padding: 0.5rem 0; border-bottom: 1px solid rgba(77,53,64,0.10);
  color: #4d3540; text-decoration: none; font-size: 0.95rem; line-height: 1.35; transition: color .15s ease;
}
.sidebar-toc__list a:hover { color: #8b4a5a; }
.sidebar-toc__list a span { color: #aab5a1; transform: translateX(0); transition: transform .15s ease; }
.sidebar-toc__list a:hover span { transform: translateX(3px); }
.sidebar-toc__list li.is-active a { color: #8b4a5a; font-weight: 600; }
.sidebar-newsletter .newsletter-form { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.75rem; }
.sidebar-newsletter .newsletter-form input { flex: 1 1 60%; }

/* Scroll offset so anchor jumps clear the sticky header */
.article-content :is(h2, h3)[id] { scroll-margin-top: 120px; }
.page-content :is(h2, h3)[id] { scroll-margin-top: 120px; }
.faq[id], .toc[id] { scroll-margin-top: 120px; }

/* Pagination (WordPress numeric) */
.pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.5rem; height: 2.5rem; padding: 0 0.75rem; border-radius: 999px;
  text-decoration: none; color: #4d3540; border: 1px solid rgba(77,53,64,0.18);
}
.pagination .page-numbers.current { background: #4d3540; color: #fcf9f5; border-color: #4d3540; }

/* ===================================================================
 * MOBILE FIXES (iPhone / Samsung) — stop horizontal overflow that made
 * the page scroll sideways and the header look "broken".
 * =================================================================== */

/* The homepage category strip becomes a swipe carousel under 640px. Its
 * `width: calc(100vw - 12px)` ignored the container padding and pushed past
 * the viewport, causing sideways scroll. Pin it to the container width. */
@media (max-width: 640px) {
  .category-grid {
    width: 100% !important;
    max-width: 100%;
    margin-left: 0 !important;
    padding-right: 4px;
    scroll-padding-left: 0;
  }
}

/* Wide styled tables shouldn't break the page on phones — let them scroll
 * inside their own box instead of forcing the whole layout wider. */
@media (max-width: 640px) {
  .article-content,
  .page-content { overflow-x: hidden; }
  .pml-table { display: block; width: 100%; min-width: 0; overflow-x: auto; }
}

/* Belt-and-suspenders: never allow the document to scroll sideways on small
 * screens. `clip` (not `hidden`) so the sticky header keeps working. */
@media (max-width: 820px) {
  html { overflow-x: clip; }
}

/* Comfortable header on the smallest phones: keep the brand from crowding the
 * icon buttons, and trim the announcement so it stays on one line. */
@media (max-width: 380px) {
  .site-logo { font-size: 1.7rem; }
  .announcement { font-size: 0.58rem; letter-spacing: 0.06em; padding: 7px 10px; }
}
