/*
 Theme Name:   WebbPlatsen (GeneratePress Child)
 Theme URI:    https://generatepress.com
 Description:  GeneratePress Nordic Child Theme
 Author:       WebbPlatsen
 Author URI:   https://webbplatsen.se
 Template:     generatepress
 Version:      0.6
*/

/* =========================================================
   TOKENS
   ========================================================= */
:root{
  --n-bg: #fbfbfa;
  --n-text: #111213;
  --n-muted: rgba(17,18,19,.70);

  --n-surface: rgba(17,18,19,.02);
  --n-surface-hover: rgba(17,18,19,.035);

  --n-radius: 16px;

  --n-space-2: .75rem;
  --n-space-3: 1rem;
  --n-space-4: 1.5rem;
  --n-space-5: 2.25rem;

  --n-measure: 78ch;

  /* Set this to match your top bar background */
  --n-accent: #2F4468;
  --n-accent-text: #ffffff;
}

/* =========================================================
   GLOBAL
   ========================================================= */
body{
  background: var(--n-bg);
  color: var(--n-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media (min-width: 1024px){
  .site-container,
  .grid-container{
    max-width: 1280px;
  }
}

.entry-content,
.wp-block-post-content{
  line-height: 1.75;
  font-size: 1.0625rem; /* ~17px */
}

/* Cap content blocks */
.entry-content > *:not(.alignwide):not(.alignfull),
.wp-block-post-content > *:not(.alignwide):not(.alignfull){
  max-width: var(--n-measure);
  margin-left: auto;
  margin-right: auto;
}

/* Headings */
.entry-content h1, .entry-content h2, .entry-content h3,
.wp-block-post-content h1, .wp-block-post-content h2, .wp-block-post-content h3{
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.entry-content h2, .wp-block-post-content h2{ margin-top: var(--n-space-5); }
.entry-content h3, .wp-block-post-content h3{ margin-top: var(--n-space-4); }

/* Links */
.entry-content a,
.wp-block-post-content a{
  text-decoration-thickness: 0.06em;
  text-underline-offset: 0.2em;
}
.entry-content a:hover,
.wp-block-post-content a:hover{
  text-decoration-thickness: 0.12em;
}

/* =========================================================
   GENERATEPRESS — de-noise separate containers
   ========================================================= */
.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .paging-navigation,
.separate-containers .widget{
  border: 0 !important;
  box-shadow: none !important;
}

.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .paging-navigation{
  padding-top: var(--n-space-4);
  padding-bottom: var(--n-space-4);
}

.widget-title{
  margin-bottom: .5rem;
}

/* =========================================================
   HEADER ALIGNMENT — your markup:
   .inside-article > header.entry-header > h1.entry-title
   Goal: same left edge as paragraph measure.
   ========================================================= */

/* Make header itself behave like a capped content block */
.inside-article > .entry-header{
  max-width: var(--n-measure);
  margin-left: auto !important;
  margin-right: auto !important;

  /* kill any theme padding that pushes it left/right */
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Ensure title doesn’t carry weird margins */
.inside-article > .entry-header > .entry-title{
  max-width: var(--n-measure);
  margin-left: 0 !important;
  margin-right: 0 !important;

  margin-top: 0;
  margin-bottom: var(--n-space-3);
}

/* Also align common non-block content that might appear directly in entry-content wrapper */
.inside-article > .entry-header + .entry-content{
  max-width: none; /* keep entry-content normal; children are capped */
}

/* =========================================================
   CATALOG CARDS
   ========================================================= */
.n-card{
  background: var(--n-surface);
  border-radius: var(--n-radius);
  padding: 1.15rem;
  margin-bottom: 1.1rem;
}
.n-card:hover{ background: var(--n-surface-hover); }

.n-card > *:first-child{ margin-top: 0; }
.n-card > *:last-child{ margin-bottom: 0; }

/* Tighten Gutenberg vertical rhythm inside cards */
.n-card .wp-block-group__inner-container > *{
  margin-top: .65rem;
  margin-bottom: .65rem;
}
.n-card .wp-block-group__inner-container > *:first-child{ margin-top: 0; }
.n-card .wp-block-group__inner-container > *:last-child{ margin-bottom: 0; }

/* CTA button inside cards */
.n-card .wp-block-buttons{ margin-top: var(--n-space-3); }
.n-card .wp-block-button,
.n-card .wp-block-button__link{ width: 100%; }

.n-card .wp-block-button__link{
  display: block;
  text-align: left;

  padding: .8rem .95rem !important;
  border-radius: 12px;

  background: var(--n-accent) !important;
  border: 0 !important;
  box-shadow: none !important;

  color: var(--n-accent-text) !important;
  text-decoration: none !important;
  font-weight: 600;
  opacity: .95;
}

.n-card .wp-block-button__link:hover{ opacity: 1; }

.n-card .wp-block-button__link:focus-visible{
  outline: 2px solid rgba(17,18,19,.35);
  outline-offset: 3px;
}

.n-card .wp-block-button__link::after{ content: " →"; }

/* =========================================================
   BLOG/ARCHIVE LISTING
   ========================================================= */
.blog .site-main article,
.archive .site-main article,
.search .site-main article{
  margin-bottom: var(--n-space-4);
}

.blog .entry-meta,
.archive .entry-meta,
.search .entry-meta{
  color: var(--n-muted);
  font-size: .92em;
}

/* =========================================================
   EXISTING SITE-SPECIFIC RULES (kept)
   ========================================================= */

/* CONTENT AREA */
.button{
  padding: 5px 10px;
  margin-bottom: 5px;
}

/* WOOCOMMERCE */
p.price{ display:none; }

.woocommerce-cart-form__contents .button.button{
  background-color: #ccc;
}

#wc-mini-cart a{
  font-size: 14px;
}

/* Display Posts */
.display-posts-listing h3{
  font-size: 32px;
  margin-bottom: 0;
}
p.dps-meta{ margin-bottom: 10px; }
.dps-meta span.date{
  color: #999;
  font-size: 13px;
}



/* =========================================================
   GP NORDIC — Changeblog polish (light + clean)
   Safe: only affects blog/archive/search listings + widgets
   ========================================================= */

/* Slightly wider measure on listings to avoid “too narrow on desktop” */
body.blog,
body.archive,
body.search {
  --n-measure: 88ch;
}

/* Make the listing feel like calm release notes (no boxes, just rhythm) */
body.blog .site-main article,
body.archive .site-main article,
body.search .site-main article {
  margin: 0 0 1.75rem 0;
  padding: 0 0 1.5rem 0;
  border-bottom: 1px solid rgba(17,18,19,.10);
}

/* Avoid an extra divider at the end */
body.blog .site-main article:last-of-type,
body.archive .site-main article:last-of-type,
body.search .site-main article:last-of-type {
  border-bottom: 0;
  padding-bottom: 0;
}

/* Titles: calmer size + consistent spacing */
body.blog .entry-title,
body.archive .entry-title,
body.search .entry-title {
  margin: 0 0 .35rem 0;
  font-size: clamp(1.25rem, 1.2vw + 1rem, 1.6rem);
  font-weight: 650;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

body.blog .entry-title a,
body.archive .entry-title a,
body.search .entry-title a {
  text-decoration: none;
}

body.blog .entry-title a:hover,
body.archive .entry-title a:hover,
body.search .entry-title a:hover {
  text-decoration: underline;
  text-decoration-thickness: .10em;
  text-underline-offset: .18em;
}

/* Meta/date: smaller, lighter, “release note” vibe */
body.blog .entry-meta,
body.archive .entry-meta,
body.search .entry-meta {
  margin: 0 0 .9rem 0;
  color: rgba(17,18,19,.62);
  font-size: .92rem;
}

/* Content excerpt rhythm */
body.blog .entry-summary,
body.archive .entry-summary,
body.search .entry-summary,
body.blog .entry-content,
body.archive .entry-content,
body.search .entry-content {
  line-height: 1.75;
}

/* Lists inside posts: less heavy, better markers */
body.blog .site-main article ul,
body.archive .site-main article ul {
  padding-left: 1.1rem;
}
body.blog .site-main article li::marker,
body.archive .site-main article li::marker {
  color: var(--n-accent, #2F4468);
}

/* Pagination: calm */
body.blog .paging-navigation,
body.archive .paging-navigation {
  margin-top: 2rem;
}

/* “Recent Posts” area: make it look intentional, not tacked on */
body.blog .widget-area,
body.archive .widget-area {
  margin-top: 2rem;
}

body.blog .widget-title,
body.archive .widget-title {
  font-size: 1.05rem;
  margin-bottom: .75rem;
}

/* Recent posts list: remove bullets, add gentle spacing */
body.blog .widget ul,
body.archive .widget ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
body.blog .widget ul li,
body.archive .widget ul li {
  margin: 0;
  padding: .45rem 0;
  border-bottom: 1px solid rgba(17,18,19,.08);
}
body.blog .widget ul li:last-child,
body.archive .widget ul li:last-child {
  border-bottom: 0;
}

/* =========================================================
   Changeblog dates — monospace + slightly smaller
   ========================================================= */

body.blog .posted-on time.entry-date,
body.archive .posted-on time.entry-date {
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.85rem;          /* slightly smaller than body text */
  letter-spacing: 0.02em;      /* helps readability of dates */
  color: rgba(17,18,19, .65);  /* keep it subtle */
}

/* =========================================================
   Remove dividers between Changeblog posts
   ========================================================= */

body.blog .site-main article,
body.archive .site-main article {
  border-bottom: none !important;
  padding-bottom: 0;      /* removes the visual gap that came with the divider */
  margin-bottom: 1.6rem;  /* keep pleasant breathing room instead */
}

/* =========================================================
   Changeblog sidebar / "Recent Posts" — minimal, no dividers
   ========================================================= */

body.blog .widget,
body.archive .widget {
  margin: 0 0 1.25rem 0;
}

body.blog .widget-title,
body.archive .widget-title {
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin-bottom: 0.5rem;
}

/* Remove list styling + dividers */
body.blog .widget ul,
body.archive .widget ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

body.blog .widget ul li,
body.archive .widget ul li {
  padding: 0.25rem 0;
  margin: 0;
  border: 0 !important;
}

/* Make links calmer + readable */
body.blog .widget a,
body.archive .widget a {
  text-decoration: none;
}

body.blog .widget a:hover,
body.archive .widget a:hover {
  text-decoration: underline;
  text-decoration-thickness: 0.10em;
  text-underline-offset: 0.18em;
}

/* If the widget contains nested lists, keep them tight too */
body.blog .widget ul ul,
body.archive .widget ul ul {
  margin-top: 0.25rem;
  padding-left: 0.85rem;
}