/*
Theme Name:     ME25
Theme URI:      https://max-elements.com/me25
Description:    A reusable base child theme of Twenty Twenty-Five by Max Elements.
Author:         Max Elements
Author URI:     https://max-elements.com
Template:       twentytwentyfive
Version:        1.0
License:        GNU General Public License v2 or later
License URI:    https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:    me25
Tags:           custom-theme, child-theme, base-theme

This is a child theme for the Twenty Twenty-Five WordPress theme.
*/
:root {
  /* My Silly Catz Color Scheme */
  --me25-primary: #4A9C88;
  --me25-accent: #F39A6C;
  --me25-text-dark: #333333;
  --me25-text-light: #FFFFFF;
  --me25-bg: #F8F4E6;
  --me25-bg-alt: #E6F4F0;
  --me25-border: #D4E6E1; /* New subtle border color */
}

body {
  background-color: var(--me25-bg);
  color: var(--me25-text-dark);
  font-family: 'Inter', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--me25-primary);
  font-family: 'Poppins', sans-serif;
}

a {
  color: var(--me25-accent);
}

a:hover {
  color: var(--me25-primary);
}

/* Example: Style a button */
.button {
  background-color: var(--me25-accent);
  color: var(--me25-text-light);
  border: none;
  padding: 10px 20px;
  border-radius: 5px;
}

.button:hover {
  background-color: var(--me25-primary);
}

/* TARGET ONLY THE GROUP WITH THE CUSTOM CLASS */
.wp-block-group.about-hero-section {
    position: relative;
    isolation: isolate;
}

/* Apply overlay ONLY to this specific group */
.wp-block-group.about-hero-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(74, 156, 136, 0.4); /* Your adjusted opacity */
    z-index: -1;
}

/* Ensure text is visible and white */
.wp-block-group.about-hero-section * {
    position: relative;
    z-index: 1;
    color: #ffffff;
}

/* BACK TO TOP STYLE */
#back2top_btn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  border: 2px solid #4A9C88;       /* Primary green border */
  outline: none;
  background-color: #F39A6C;       /* Coral accent background */
  cursor: pointer;
  padding: 12px;
  border-radius: 8px;
  fill: #4A9C88;
}

#back2top_btn:hover {
  background-color: #4A9C88;       /* Green background on hover */
}

/* Change the SVG icon color to white on hover */
#back2top_btn:hover svg {
  fill: #FFFFFF;                   /* White icon on hover */
}

/* Fluent Forms Button */
.fluentform .ff-btn-submit {
    background-color: #4A9C88 !important;
    color: #FFFFFF !important;
    border: none !important;
    font-weight: 800;
}

.fluentform .ff-btn-submit:hover {
    background-color: transparent !important;
    color: #4A9C88 !important;
    border: solid 3px #4A9C88 !important;
}

/* Web Designer Credits */
.wp-block-group.me25-mini-credits {
  background: var(--me25-bg, #F8F9FA);
  border-left: 4px solid var(--me25-accent, #C17F3A);
  border-top: 1px solid var(--me25-accent, #C17F3A);
  border-bottom: 1px solid var(--me25-accent, #C17F3A);
  border-right: 1px solid var(--me25-accent, #C17F3A);
  border-radius:  0px 10px 10px 0px;
  padding: 1.5rem;
  margin: 2rem 0;
  text-align: center;
  font-size: 70%;
}

.wp-block-group.me25-mini-credits img {
  width: 60%; /* Scales down to 80% of original size (adjust 80% to 75% if needed) */
  max-width: 133px; /* 80% of 166px = ~133px */
  margin-bottom: 1rem;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
}