/*
Theme Name:        LicentieSleutels Blog
Theme URI:         https://blog.licentiesleutels.nl/
Author:            Eric Dieperink (Daan-Agent / Hermes)
Author URI:        https://licentiesleutels.nl/
Description:       Child theme van Twenty Twenty-Five met de huisstijl van licentiesleutels.nl (dark + indigo/violet SaaS, Inter font, glassmorphism).
Version:           1.0.0
Requires at least: 6.7
Tested up to:      6.7
Requires PHP:      7.4
Template:          twentytwentyfive
Text Domain:       licentiesleutels-blog
Tags:              dark, blog, custom-colors, custom-logo, custom-menu, full-site-editing, block-styles
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

/* =================================================================
   licentiesleutels-blog — child theme stylesheet
   Override Twenty Twenty-Five tokens + element styling
   ================================================================= */

:root,
body.wp-site-blocks,
.wp-site-blocks,
.editor-styles-wrapper {
  --wp--preset--color--base:        #07080d;
  --wp--preset--color--base-2:      #0b0c14;
  --wp--preset--color--contrast:    #e8eaed;
  --wp--preset--color--contrast-2:  #a1a4ad;
  --wp--preset--color--contrast-3:  #6b6e78;
  --wp--preset--color--accent:      #7c5cff;
  --wp--preset--color--accent-1:    #6366f1;
  --wp--preset--color--accent-2:    #a855f7;
  --wp--preset--color--accent-3:    rgba(124,92,255,0.15);
  --wp--preset--color--accent-4:    #a855f7;
  --wp--preset--color--accent-5:    rgba(124,92,255,0.35);

  --ls-bg:            #07080d;
  --ls-bg-2:          #0b0c14;
  --ls-surface:       #11131c;
  --ls-surface-2:     #161824;
  --ls-text:          #e8eaed;
  --ls-text-muted:    #a1a4ad;
  --ls-accent:        #7c5cff;
  --ls-accent-2:      #a855f7;
  --ls-border:        rgba(255,255,255,0.07);
  --ls-border-strong: rgba(255,255,255,0.12);
  --ls-gradient:      linear-gradient(135deg, #6366f1 0%, #a855f7 100%);

  --wp--preset--font-family--manrope:
    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

html, body { background-color: var(--ls-bg) !important; }

body {
  background-image:
    radial-gradient(ellipse 80% 50% at 50% -20%, rgba(124,92,255,0.12), transparent 60%),
    radial-gradient(ellipse 60% 50% at 100% 0%,  rgba(168,85,247,0.08), transparent 50%) !important;
  background-attachment: fixed !important;
  color: var(--ls-text) !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.wp-block-heading,
.wp-block-post-title,
.wp-block-query-title {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--ls-text) !important;
  line-height: 1.2 !important;
}

h1, .wp-block-post-title, .wp-block-query-title {
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
}

p, li, blockquote, figcaption { color: var(--ls-text) !important; }

a {
  color: var(--ls-accent) !important;
  text-decoration: none !important;
  transition: color 200ms ease !important;
}
a:hover { color: var(--ls-accent-2) !important; }

/* ----- Header (glassmorphism, sticky) ----- */
.wp-site-blocks > header,
header.wp-block-template-part,
.wp-block-template-part[data-area="header"] {
  background-color: rgba(11,12,20,0.7) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
  border-bottom: 1px solid var(--ls-border) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
}

.wp-block-site-title,
.wp-block-site-title a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800 !important;
  font-size: 1.25rem !important;
  letter-spacing: -0.025em !important;
  background: var(--ls-gradient) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  transition: opacity 200ms !important;
}
.wp-block-site-title a:hover { opacity: 0.85; }

.wp-block-navigation { font-family: 'Inter', sans-serif !important; }
.wp-block-navigation a,
.wp-block-navigation .wp-block-navigation-item__content {
  color: var(--ls-text-muted) !important;
  font-weight: 500 !important;
  font-size: 0.9375rem !important;
  transition: color 200ms !important;
}
.wp-block-navigation a:hover,
.wp-block-navigation .wp-block-navigation-item__content:hover {
  color: var(--ls-text) !important;
}

/* ----- Buttons ----- */
.wp-block-button__link,
.wp-element-button {
  background: var(--ls-gradient) !important;
  color: #ffffff !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  padding: 0.75rem 1.5rem !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.9375rem !important;
  letter-spacing: -0.005em !important;
  box-shadow: 0 4px 14px rgba(124,92,255,0.35) !important;
  transition: transform 200ms, box-shadow 200ms !important;
}
.wp-block-button__link:hover,
.wp-element-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(124,92,255,0.55) !important;
  color: #ffffff !important;
}

.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--ls-text) !important;
  border: 1px solid var(--ls-border-strong) !important;
  box-shadow: none !important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: rgba(124,92,255,0.15) !important;
  border-color: rgba(124,92,255,0.4) !important;
}

/* ----- Post cards (query loop) ----- */
.wp-block-post,
.wp-block-post-template > li {
  background: var(--ls-surface) !important;
  border: 1px solid var(--ls-border) !important;
  border-radius: 16px !important;
  padding: 1.5rem !important;
  transition: transform 200ms, border-color 200ms, box-shadow 200ms !important;
  overflow: hidden;
}
.wp-block-post:hover,
.wp-block-post-template > li:hover {
  transform: translateY(-2px);
  border-color: rgba(124,92,255,0.4) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.06), 0 12px 32px rgba(0,0,0,0.4) !important;
}

.wp-block-post-featured-image,
.wp-block-post-featured-image img {
  border-radius: 12px !important;
  overflow: hidden;
}

.wp-block-post-title a { color: var(--ls-text) !important; }
.wp-block-post-title a:hover { color: var(--ls-accent) !important; }

.wp-block-post-excerpt,
.wp-block-post-excerpt__excerpt,
.wp-block-post-date,
.wp-block-post-terms,
.wp-block-post-author-name { color: var(--ls-text-muted) !important; }

/* ----- Single post content ----- */
.wp-block-post-content {
  color: var(--ls-text) !important;
  line-height: 1.7 !important;
}
.wp-block-post-content p { margin-bottom: 1rem !important; }

.wp-block-quote, blockquote {
  border-left: 3px solid var(--ls-accent) !important;
  padding: 0.75rem 1rem 0.75rem 1.25rem !important;
  background: var(--ls-bg-2) !important;
  border-radius: 0 8px 8px 0 !important;
  color: var(--ls-text-muted) !important;
  font-style: normal !important;
  margin: 1.5rem 0 !important;
}

:not(pre) > code,
.wp-block-code code {
  background: var(--ls-bg-2) !important;
  color: var(--ls-accent) !important;
  border: 1px solid var(--ls-border) !important;
  border-radius: 6px !important;
  padding: 0.15em 0.4em !important;
  font-size: 0.9em !important;
}
.wp-block-code {
  background: var(--ls-bg-2) !important;
  border: 1px solid var(--ls-border) !important;
  border-radius: 12px !important;
  padding: 1rem !important;
}

/* ----- Form inputs ----- */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="url"],
input[type="number"],
input[type="tel"],
textarea,
select,
.wp-block-search__input {
  background: var(--ls-bg-2) !important;
  border: 1px solid var(--ls-border-strong) !important;
  border-radius: 10px !important;
  padding: 13px 16px !important;
  color: var(--ls-text) !important;
  font-family: 'Inter', sans-serif !important;
  outline: none !important;
  transition: border-color 250ms, box-shadow 250ms !important;
}
input:focus, textarea:focus, .wp-block-search__input:focus {
  border-color: var(--ls-accent) !important;
  box-shadow: 0 0 0 3px rgba(124,92,255,0.15) !important;
}
::placeholder { color: var(--ls-text-muted) !important; opacity: 0.6; }

.wp-block-search__button {
  background: var(--ls-gradient) !important;
  color: #fff !important;
  border-radius: 10px !important;
  border: 0 !important;
  font-weight: 600 !important;
  padding: 0.75rem 1.25rem !important;
}

/* ----- Pagination ----- */
.wp-block-query-pagination a,
.wp-block-query-pagination-numbers a,
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
  color: var(--ls-text-muted) !important;
  border: 1px solid var(--ls-border) !important;
  border-radius: 8px !important;
  padding: 0.5rem 0.85rem !important;
  background: var(--ls-surface) !important;
}
.wp-block-query-pagination a:hover { color: var(--ls-text) !important; border-color: rgba(124,92,255,0.4) !important; }
.wp-block-query-pagination-numbers .current {
  background: var(--ls-gradient) !important;
  color: #fff !important;
  border: 0 !important;
}

/* ----- Comments ----- */
.wp-block-comment-template > li,
.wp-block-comments-pagination,
.wp-block-comment-content,
.wp-block-comment-reply-link { color: var(--ls-text) !important; }
.wp-block-avatar img {
  border: 2px solid var(--ls-surface-2) !important;
  border-radius: 50% !important;
}

/* ----- Tables ----- */
table {
  background: var(--ls-surface) !important;
  border: 1px solid var(--ls-border) !important;
  border-radius: 12px !important;
  overflow: hidden;
}
th, td { border-color: var(--ls-border) !important; color: var(--ls-text) !important; }
th { background: var(--ls-bg-2) !important; }

/* ----- Footer ----- */
.wp-site-blocks > footer,
footer.wp-block-template-part,
.wp-block-template-part[data-area="footer"] {
  background: var(--ls-bg-2) !important;
  border-top: 1px solid var(--ls-border) !important;
  color: var(--ls-text-muted) !important;
  padding: 4rem 0 2rem !important;
  position: relative;
}
.wp-site-blocks > footer::before,
footer.wp-block-template-part::before {
  content: '';
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: 200px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--ls-accent), transparent);
  pointer-events: none;
}
footer a { color: var(--ls-text-muted) !important; }
footer a:hover { color: var(--ls-text) !important; }

::selection { background: rgba(124,92,255,0.3); color: #fff; }
html { scrollbar-color: rgba(124,92,255,0.4) transparent; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}