/**
 * Basic Page Styling
 * For Privacy Policy, Terms & Conditions, Contact, and other static pages
 */

/* =====================================================
   PAGE CONTAINER
   ===================================================== */

/* Target the article element which has the node--type-page class */
article.node--type-page {
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 40px 20px 60px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Also target via body class for extra specificity */
body.page-privacy-policy .node--type-page,
body.page-terms-and-conditions .node--type-page,
body.page-contact .node--type-page,
body.page-about .node--type-page,
body.page-about-us .node--type-page {
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 40px 20px 60px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Reset parent containers to allow centering */
body.page-privacy-policy .layout-content,
body.page-terms-and-conditions .layout-content,
body.page-contact .layout-content,
body.page-about .layout-content,
body.page-about-us .layout-content {
  max-width: 100% !important;
  padding: 0 !important;
}

body.page-privacy-policy .region--content,
body.page-terms-and-conditions .region--content,
body.page-contact .region--content,
body.page-about .region--content,
body.page-about-us .region--content {
  max-width: 100% !important;
  display: block !important;
}

article.node--type-page .node__content {
  background: #ffffff !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
  padding: 40px 50px !important;
}

@media (max-width: 768px) {
  article.node--type-page {
    padding: 20px 15px 40px !important;
  }

  article.node--type-page .node__content {
    padding: 25px 20px !important;
  }
}

/* =====================================================
   TYPOGRAPHY - Headings
   ===================================================== */
article.node--type-page .field--name-body h1 {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #1a202c !important;
  margin: 0 0 1.5rem 0 !important;
  padding-bottom: 1rem !important;
  border-bottom: 3px solid #0c7e52 !important;
  line-height: 1.2 !important;
}

article.node--type-page .field--name-body h2 {
  font-size: 1.625rem !important;
  font-weight: 600 !important;
  color: #2d3748 !important;
  margin: 2.5rem 0 1rem 0 !important;
  line-height: 1.3 !important;
}

article.node--type-page .field--name-body h3 {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: #4a5568 !important;
  margin: 2rem 0 0.75rem 0 !important;
  line-height: 1.4 !important;
}

article.node--type-page .field--name-body h4,
article.node--type-page .field--name-body h5,
article.node--type-page .field--name-body h6 {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: #4a5568 !important;
  margin: 1.5rem 0 0.5rem 0 !important;
}

/* =====================================================
   TYPOGRAPHY - Body Text
   ===================================================== */
article.node--type-page .field--name-body p {
  font-size: 1rem !important;
  line-height: 1.75 !important;
  color: #4a5568 !important;
  margin: 0 0 1.25rem 0 !important;
}

article.node--type-page .field--name-body strong {
  font-weight: 600 !important;
  color: #2d3748 !important;
}

/* =====================================================
   LISTS
   ===================================================== */
article.node--type-page .field--name-body ul,
article.node--type-page .field--name-body ol {
  margin: 0 0 1.5rem 0 !important;
  padding-left: 1.5rem !important;
}

article.node--type-page .field--name-body li {
  font-size: 1rem !important;
  line-height: 1.75 !important;
  color: #4a5568 !important;
  margin-bottom: 0.75rem !important;
}

article.node--type-page .field--name-body li p {
  margin-bottom: 0.5rem !important;
}

article.node--type-page .field--name-body ul li {
  list-style-type: disc !important;
}

article.node--type-page .field--name-body ul ul li {
  list-style-type: circle !important;
}

article.node--type-page .field--name-body ol li {
  list-style-type: decimal !important;
}

/* Nested lists */
article.node--type-page .field--name-body ul ul,
article.node--type-page .field--name-body ol ol,
article.node--type-page .field--name-body ul ol,
article.node--type-page .field--name-body ol ul {
  margin: 0.5rem 0 0.5rem 1rem !important;
}

/* =====================================================
   LINKS
   ===================================================== */
article.node--type-page .field--name-body a {
  color: #0c7e52 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(12, 126, 82, 0.3) !important;
  text-underline-offset: 2px !important;
  transition: all 0.2s ease !important;
}

article.node--type-page .field--name-body a:hover {
  color: #0a6b45 !important;
  text-decoration-color: #0c7e52 !important;
}

/* =====================================================
   BLOCKQUOTES
   ===================================================== */
article.node--type-page .field--name-body blockquote {
  margin: 1.5rem 0 !important;
  padding: 1rem 1.5rem !important;
  border-left: 4px solid #0c7e52 !important;
  background: #f7fafc !important;
  border-radius: 0 8px 8px 0 !important;
}

article.node--type-page .field--name-body blockquote p {
  margin: 0 !important;
  font-style: italic !important;
  color: #4a5568 !important;
}

/* =====================================================
   TABLES
   ===================================================== */
article.node--type-page .field--name-body table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 1.5rem 0 !important;
  font-size: 0.95rem !important;
}

article.node--type-page .field--name-body th,
article.node--type-page .field--name-body td {
  padding: 12px 16px !important;
  text-align: left !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

article.node--type-page .field--name-body th {
  background: #f7fafc !important;
  font-weight: 600 !important;
  color: #2d3748 !important;
}

article.node--type-page .field--name-body tr:hover td {
  background: #f7fafc !important;
}

/* =====================================================
   LAST UPDATED / DATE TEXT
   ===================================================== */
article.node--type-page .field--name-body p:first-of-type {
  font-size: 0.9rem !important;
  color: #718096 !important;
  margin-bottom: 2rem !important;
}

/* =====================================================
   CONTACT PAGE SPECIFIC
   ===================================================== */

/* Contact page uses Drupal's contact form, not a basic page node */
body.page-contact .layout-content,
body.page-contact .region--content {
  max-width: 700px !important;
  margin: 0 auto !important;
  padding: 40px 20px 60px !important;
}

body.page-contact .block__content {
  background: #ffffff !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
  padding: 40px 50px !important;
}

body.page-contact .contact-form {
  max-width: 100% !important;
}

/* Contact page title - add if there's an h1 */
body.page-contact h1.page-title,
body.page-contact .page-title {
  font-size: 2.25rem !important;
  font-weight: 700 !important;
  color: #1a202c !important;
  margin: 0 0 1.5rem 0 !important;
  padding-bottom: 1rem !important;
  border-bottom: 3px solid #0c7e52 !important;
  line-height: 1.2 !important;
}

/* Also keep styles for basic page contact if it exists */
.page-contact .node--type-page .node__content {
  max-width: 700px;
  margin: 0 auto;
}

/* Contact form styling */
body.page-contact .webform-submission-form,
body.page-contact .contact-form {
  margin-top: 0 !important;
}

body.page-contact .form-item {
  margin-bottom: 1.5rem !important;
}

body.page-contact .form-item label {
  display: block !important;
  font-weight: 500 !important;
  color: #2d3748 !important;
  margin-bottom: 0.5rem !important;
  font-size: 0.95rem !important;
}

body.page-contact input[type="text"],
body.page-contact input[type="email"],
body.page-contact input[type="tel"],
body.page-contact textarea,
body.page-contact select {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  font-size: 1rem !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

body.page-contact input[type="text"]:focus,
body.page-contact input[type="email"]:focus,
body.page-contact input[type="tel"]:focus,
body.page-contact textarea:focus,
body.page-contact select:focus {
  outline: none !important;
  border-color: #0c7e52 !important;
  box-shadow: 0 0 0 3px rgba(12, 126, 82, 0.1) !important;
}

body.page-contact textarea {
  min-height: 150px !important;
  resize: vertical !important;
}

body.page-contact input[type="submit"],
body.page-contact button[type="submit"] {
  background: linear-gradient(135deg, #0c7e52 0%, #059669 100%) !important;
  color: white !important;
  padding: 14px 32px !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: transform 0.2s, box-shadow 0.2s !important;
}

body.page-contact input[type="submit"]:hover,
body.page-contact button[type="submit"]:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(12, 126, 82, 0.3) !important;
}

/* Hide description text under form fields */
body.page-contact .form-item .description {
  font-size: 0.85rem !important;
  color: #718096 !important;
  margin-top: 0.25rem !important;
}

@media (max-width: 768px) {
  body.page-contact .layout-content,
  body.page-contact .region--content {
    padding: 20px 15px 40px !important;
  }

  body.page-contact .block__content {
    padding: 25px 20px !important;
  }
}

/* =====================================================
   RESET INLINE STYLES FROM WYSIWYG
   ===================================================== */
article.node--type-page .field--name-body h1[style],
article.node--type-page .field--name-body h2[style],
article.node--type-page .field--name-body h3[style],
article.node--type-page .field--name-body h4[style],
article.node--type-page .field--name-body h5[style],
article.node--type-page .field--name-body h6[style],
article.node--type-page .field--name-body p[style],
article.node--type-page .field--name-body ul[style],
article.node--type-page .field--name-body ol[style],
article.node--type-page .field--name-body li[style],
article.node--type-page .field--name-body a[style],
article.node--type-page .field--name-body span[style],
article.node--type-page .field--name-body strong[style],
article.node--type-page .field--name-body em[style],
article.node--type-page .field--name-body div[style] {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  color: inherit !important;
  background-color: transparent !important;
  background: transparent !important;
  -webkit-text-stroke-width: unset !important;
  font-style: inherit !important;
  font-variant-caps: normal !important;
  font-variant-ligatures: normal !important;
  letter-spacing: normal !important;
  text-align: inherit !important;
  text-decoration: inherit !important;
  text-indent: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
  word-spacing: normal !important;
  orphans: unset !important;
  widows: unset !important;
}

/* =====================================================
   PRINT STYLES
   ===================================================== */
@media print {
  article.node--type-page {
    max-width: 100% !important;
    padding: 0 !important;
  }

  article.node--type-page .node__content {
    box-shadow: none !important;
    padding: 20px !important;
  }
}
