/* ==========================================================================
   NOUVEAU (نُ‌وو) — wordpress.css
   Styles needed only in the WordPress theme (loaded after responsive.css):
   1. Admin bar & accessibility    4. Pagination
   2. Blog search                  5. Post content (blocks) & default pages
   3. Contact Form 7 (contact + newsletter)
   ========================================================================== */

/* 1. ADMIN BAR & ACCESSIBILITY ------------------------------------------- */
.admin-bar .nv-header { top: 32px; }
body.page-home.admin-bar .nv-header { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .nv-header { top: 46px; }
  body.page-home.admin-bar .nv-header { top: 46px; }
}
@media (max-width: 600px) {
  .admin-bar .nv-header { top: 0; }
}
.screen-reader-text {
  border: 0; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}
.nv-admin-hint { margin: 0 0 16px; padding: 10px 14px; border-radius: 12px; background: #fff4e5; color: #8a4b00; font-size: 13px; }

/* 2. BLOG SEARCH ---------------------------------------------------------- */
.mag-search input::-webkit-search-cancel-button { cursor: pointer; }

/* 3. CONTACT FORM 7 -------------------------------------------------------- */
.wpcf7 form { margin: 0; }
.wpcf7-form-control-wrap { display: block; position: relative; }
.wpcf7-not-valid-tip { display: block; margin-top: 4px; padding-inline: 14px; font-size: 12px; color: #dc3545; }
.wpcf7 form .wpcf7-response-output { margin: 10px 0 0; padding: 0; border: 0; font-size: 13px; color: #1a7f4b; min-height: 1.6em; }
/* keep the message line's space before the first submit (as the design's status line) */
.wpcf7 form.init .wpcf7-response-output { display: block; visibility: hidden; }
.contact--compact .wpcf7 form.init .wpcf7-response-output { display: none; }   /* design 2026: the form ends with the cards; the message line appears only after sending */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output { color: #dc3545; }
.wpcf7-spinner { position: absolute; margin: 0; }

/* Contact page form — same look as the design */
.contact__form .form-control.wpcf7-not-valid { border-color: #dc3545; }
.contact__form .wpcf7-submit { position: relative; width: 100%; }
.contact__form form { position: relative; }
.contact__form .wpcf7-spinner { inset-inline-start: 16px; bottom: 58px; }

/* Newsletter: the pill holds the input + button (CF7 form or the fallback form) */
.newsletter form { display: block; max-width: none; height: auto; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; overflow: visible; }
.newsletter .nl-pill {   /* same box as the static form (style.css «Newsletter») */
  position: relative; display: flex; align-items: stretch; max-width: 529px; height: 45px; margin: 28px auto 0; padding: 0;
  border-radius: 999px; border: 1px solid rgba(128, 128, 128, .5); background: #fff; overflow: hidden;
}
.newsletter .nl-pill .wpcf7-form-control-wrap { display: flex; flex: 1; min-width: 0; }
.newsletter .nl-pill input[type="email"] { width: 100%; height: 100%; flex: 1; min-width: 0; }
.newsletter .nl-pill .btn-nv {
  flex: none; width: 109px; height: 100%; padding: 0; border: 0; border-radius: 999px;
  background: var(--nv-red); color: #fff; font: 500 14px/1 var(--nv-font); box-shadow: none; cursor: pointer;
}
.newsletter .nl-pill .btn-nv:hover { background: var(--nv-red-dark); }
.newsletter .nl-pill .wpcf7-not-valid-tip { display: none; }
.newsletter .nl-pill .wpcf7-spinner { inset-inline-end: 118px; top: 50%; translate: 0 -50%; }   /* inside the pill, next to the button */
.newsletter .wpcf7 form .wpcf7-response-output { margin-top: 6px; min-height: 1.6em; font-size: 13px; text-align: center; }   /* same space as the static status line */

/* 4. PAGINATION ------------------------------------------------------------ */
.nv-pagination { margin: -30px 0 70px; }
.nv-pagination .nav-links { display: flex; justify-content: center; align-items: center; gap: 8px; }
.nv-pagination .page-numbers {
  display: grid; place-items: center; min-width: 40px; height: 40px; padding: 0 8px; border-radius: 999px;
  background: #fff; color: var(--nv-heading-dark); font-size: 14px;
  box-shadow: 0 1px 3px rgba(16, 24, 40, .1), 0 1px 2px rgba(16, 24, 40, .06);
}
.nv-pagination .page-numbers.current { background: var(--nv-violet-900); color: #fff; }
.nv-pagination a.page-numbers:hover { color: var(--nv-violet-900); }
.nv-pagination .dots { box-shadow: none; background: none; }

/* 5. POST CONTENT & DEFAULT PAGES ----------------------------------------- */
.article-body h3, .article-body h4 { margin-top: var(--nv-space-block); }
.article-body ul, .article-body ol { margin: var(--nv-space-text) 0; padding-inline-start: 24px; font-size: 14px; line-height: var(--nv-lh-text); color: var(--nv-text); }
.article-body ul { list-style: disc; }
.article-body ol { list-style: decimal; }
.article-body a { color: var(--nv-violet-600); text-decoration: underline; text-underline-offset: 3px; }
.article-body img { border-radius: 12px; }
.article-body figure { margin: 20px 0; }
.article-body figcaption { font-size: 12px; color: var(--nv-muted); text-align: center; margin-top: 8px; }
.article-body blockquote { margin: 20px 0; padding: 14px 20px; border-inline-start: 4px solid var(--nv-violet-900); background: rgba(105, 65, 198, .05); border-radius: 8px; }
.article-body blockquote p { padding: 0; }
.aligncenter { display: block; margin-inline: auto; }
.alignright { float: right; margin: 0 0 12px 20px; }
.alignleft { float: left; margin: 0 20px 12px 0; }

/* About page — rich-text blocks (the list sits on the same rhythm as the text) */
.about-block__text p + p { margin-top: 0; }
.about-block__text ul, .about-block__text ol { margin: 0; padding: 0; }
.about-block__text li { font-size: 16px; line-height: var(--nv-lh-text); color: var(--nv-ink); text-align: start; }

/* Default page */
.nv-page { padding-block: clamp(36px, 7vw, 76px) 80px; }
.nv-page__content { font-size: 15px; line-height: var(--nv-lh-text); color: var(--nv-text); }
.nv-page__content > * + * { margin-top: var(--nv-space-text); }
.nv-page__content ul { list-style: disc; padding-inline-start: 24px; }
.nv-page__content ol { list-style: decimal; padding-inline-start: 24px; }
.nv-page__content a { color: var(--nv-red); text-decoration: underline; }

/* Products page: the logged-in admin bar also takes screen height */
.admin-bar .products { --p-vh: calc(100 * var(--vu) - var(--nv-header-h) - 32px); }
@media (max-width: 782px) {
  .admin-bar .products { --p-vh: calc(100 * var(--vu) - var(--nv-header-h) - 46px); }
}
