/**
 * Theme Name:        Ayurvida
 * Theme URI:         https://anneayurvida.com
 * Text Domain:       ayurvida
 * Version:           1.0
 * Tested up to:      7.0.2
 * Requires at least: 5.8
 * Requires PHP:      7.4
 */
body {
margin: 0;
padding: 0;
}

.hf-message {
	padding: 1rem;
	border: solid 2px;
	background: #0001;
	border-radius: 10px;
}

.hf-message-success {
	border-color: #32cd32;
	background: #32cd3250;
}

.page-id-2 footer,
.page-id-10 footer,
.page-id-13 footer,
.page-id-17 footer,
.page-id-276 footer,
.page-id-278 footer,
.page-id-1029 footer,
.page-id-3333 footer {
margin-top: 4rem;
}

.page-id-2 header,
.page-id-10 header,
.page-id-17 header,
.page-id-278 header,
.page-id-282 header,
.page-id-1029 header,
.page-id-3333 header {
margin-bottom: 4rem;
}

.massage h1,
.massage p,
.beratung h1,
.beratung p {
color: var(--wp--preset--color--accent-50);
text-shadow: 2px 2px 1px black;
}

.yoga-sound ul {
list-style-type: "\2600\FE0E\2002";
font-size: larger;
letter-spacing: 1px;
text-transform: uppercase;
}

.yoga-sound li + li {
margin-top: .5rem;
}

.wwp-block-cb-carousel-v2 {
margin-block-start: 80px;
margin-block-end: 80px;
}

.cb-button-prev, .cb-button-next {
opacity: .5;
}

.wp-block-heading a, .wp-block-post-title a {
color: currentcolor;
text-decoration: none;
}

article {
max-width: 1000px;
margin: 4rem auto;
}

.page-id-17 main .wp-block-group,
.page-id-1029 main .wp-block-group {
max-width: 800px;
margin: 0 auto;
}

.wp-block-table, .wp-block-table.is-style-stripes {
border: solid 2px #fff3;
border-radius: 10px;
}

.wp-block-table > table {
background: transparent;
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
background-color: transparent;
}

.wp-block-table thead, .wp-block-table td, .wp-block-table th {
border: none;
}

.wp-block-table .wp-element-caption {
padding: .5rem;
}

th {
font-size: small;
font-weight: bold;
vertical-align: bottom;
background: #fff3;
}

/* Hauptcontainer auf min. 100vh setzen */
.wp-site-blocks,
body {
min-height: 100vh;
display: flex;
flex-direction: column;
margin: 0; /* Sicherstellen, dass keine Standard-Margins stoeren */
}

/* Hauptinhalt dehnt sich, um leeren Raum zu fuellen */
.wp-site-blocks > main,
main,
#content,
.site-content {
flex: 1;
}

/* Admin-Bar Korrektur (optional) */
.admin-bar .wp-site-blocks,
.admin-bar body {
min-height: calc(100vh - 32px);
}

.paddined {
padding: 1rem;
}

.centered, .center {
text-align: center;
}

h2.centered, h3.centered {
max-width: 500px;
margin-left: auto;
margin-right: auto;
border-bottom: 2px solid var(--wp--preset--color--accent-800);
padding-bottom: .5rem;
letter-spacing: 1px;
}

.large {
font-size:  var(--wp--preset--font-size--large);
}

.x-large {
font-size:  var(--wp--preset--font-size--x-large);
}

.font-accent {
font-family: var(--wp--preset--font-family--libre-baskerville);
font-style: italic;
color: var(--wp--preset--color--accent-1);
}

.font-base {
font-family: var(--wp--preset--font-family--system-fonts);
}

.accent-light {
background: var(--wp--preset--color--accent-1);
}

.round-10, .cb-carousel-block img {
border-radius: 10px;
}

.shadow {
text-shadow: 2px 2px 1px black;
}

.space {
padding: 15rem 0;
border-bottom: 3px solid var(--wp--preset--color--accent-1);
}

.hf-fields-wrap div {
margin-bottom: 15px;
}

.hf-fields-wrap label {
margin-bottom: 5px;
display: block;
}

.hf-fields-wrap select,
.hf-fields-wrap textarea,
.hf-fields-wrap input[type="text"],
.hf-fields-wrap input[type="email"],
.hf-fields-wrap input[type="number"] {
width: 100%;
display: block;
box-sizing: border-box;
font-family: inherit;
font-size: 1em;
}

.hf-fields-wrap select {
padding: 1rem;
border: 2px solid var(--wp--preset--color--accent-100);
border-radius: 5px;
background: var(--wp--preset--color--accent-50);
}

input[type=submit],
button[type=submit] {
box-sizing: border-box;
padding: 1rem 2rem;
border: none;
border-radius: 10px;
background: var(--wp--preset--color--accent-500);
color: var(--wp--preset--color--contrast);
font-family: var(--wp--preset--font-family--system-fonts);
font-size: var(--wp--preset--font-size--medium);
}

header {
box-sizing: border-box;
width: 100%;
background: var(--wp--preset--color--accent-300);
}

.home header,
.page-id-276 header,
.page-id-13 header {
background: rgb(198, 227, 159, 0);
}

.page-id-280 header {
background: rgb(198, 227, 159, 0);
}

header a {
text-decoration: none;
text-transform: uppercase;
letter-spacing: 1px;
}

/* Block-Design */

.box-group {
padding: 1rem;
background: var(--wp--preset--color--accent-300);
border-radius: 10px;
}

/* /home */

.home header,
.page-id-276 header,
.page-id-280 header,
.page-id-13 header {
position: absolute;
top: 0;
z-index: 1000;
}

.home header button,
.page-id-276 header button,
.page-id-280 header button,
.page-id-13 header button {
color: var(--wp--preset--color--accent-50);
}

.wp-block-navigation-overlay-close svg {
fill: var(--wp--preset--color--accent-800);
}

.home header figure a,
.page-id-276 header figure a,
.page-id-280 header figure a,
.page-id-13 header figure a {
filter: invert(100%);
}

.home .wp-block-cover h1 {
margin: .75rem 0;
padding: 0;
font-family: var(--wp--preset--font-family--system-font);
font-size: var(--wp--preset--font-size--medium);
font-weight: normal;
letter-spacing: 1px;
text-align: initial;
text-transform: uppercase;
}

.home .wp-block-cover .wp-block-paragraph {
margin: 0;
padding: 0;
font-family:  var(--wp--preset--font-family--libre-baskerville), serif;
font-style: italic;
line-height: 1.4;
}

.container-box {
border-radius: 10px;
background: var(--wp--preset--color--accent-300);
}

.hintergrund-div {
  position: relative; /* Notwendig für die Positionierung des Overlays */
  background-image: url('bild.jpg');
  background-size: cover;
  background-position: center;
  color: white;
}

/* Das dunkle Overlay */
.hintergrund-div::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  
  /* Schwarz mit 50% Deckkraft (0.0 = durchsichtig, 1.0 = deckend) */
  background-color: rgba(0, 0, 0, 0.5); 
  
  /* Sicherstellen, dass das Overlay unter dem Text liegt */
  z-index: 1; 
}

/* Der Text muss über dem Overlay liegen */
.hintergrund-div h1, 
.hintergrund-div p {
  position: relative;
  z-index: 2; 
}

.leben .wp-block-list {
padding: 0;
list-style: none;
}

.leben li {
margin-top: 3rem;
margin-left: 3.4rem;
}

.leben li::first-letter {
display: block;
float: left;
margin-top: -.75rem;
margin-left: -3.4rem;
padding: 5px;
font-family: var(--wp--preset--font-family--libre-baskerville);
font-size: 3rem;
font-weight: normal;
line-height: 1;
}

.leben li strong {
color: var(--wp--preset--color--accent-700);
letter-spacing: 1px;
text-transform: uppercase;
}

.google-rating {
width: 100%;
max-width: 100%;
display: inline-flex;
justify-content: center;
align-items: center;
gap: 0.4rem;
font-size: 0.85rem;
line-height: 1.4;
}
.google-rating__stars {
color: #fbbc04;
letter-spacing: 0.05em;
}
.google-rating__value {
font-weight: 600;
}
.google-rating__label a {
color: inherit;
text-decoration: underline;
}

/* /ayurveda */
.wp-block-columns + .wp-block-group {
margin-top: 2rem;
}

.page-id-13 .wp-block-column img {
width: 200px;
}

.parent-pageid-13 .wp-media-text {
background: var(--wp--preset--color--accent-700);
}

/* /massage */

/* "Weiterlesen" mit Abstand*/
.wp-block-post-excerpt p:last-child {
margin-top: .5rem;
font-style: italic;
}

.wp-block-post-excerpt__more-link {
padding: .5rem;
background: var(--wp--preset--color--accent-300);
color: var(--wp--preset--color--accent-900);
border-radius: 10px;
text-decoration: none;
font-size: smaller;
}

.page-template-massage-details .wp-block-media-text__media img {
border-radius: 10px;
}

.parent-pageid-276 .wp-block-post-featured-image {
max-width: 380px;
margin-bottom: 1rem;
border-radius: 10px;
overflow: hidden;
}

/* /retreats */

.yoga-sound .shadow {
text-shadow: 2px 2px 1px black;
}

.retreat-terms ul {
padding: 1rem 0;
list-style: none;
text-align: center;
word-spacing: 1rem;
}
.retreat-terms li {
display: inline;
}

footer {
background: #fff6;
border-top: dotted 1px #0005;
}

footer nav.has-background {
padding: 2rem 0 1rem;
}

footer .wp-block-navigation-item a {
padding: .5rem .5rem;
font-size: .75rem;
}

footer .wp-block-navigation-item a span {
color: var(--wp--preset--color--accent-800);
}

@media (max-width: 769px) {

header .wp-block-group {
padding: 1rem;
}

h1 {
font-size: 1.8rem;
}

.home .wp-block-cover .wp-block-paragraph {
font-size: 2rem;
}

.wp-element-button {
font-size: smaller !important;
}

.wp-block-cover + h2 {
font-size: var(--wp--preset--font-size--large);
}

.container-box img {
border-radius: 10px 10px 0 0;
}

.wp-block-media-text__content {
padding: 1rem !important;
}

}

@media (min-width: 770px) {

header .wp-block-group {
padding: 1rem 2rem 1rem 1rem;
}

.home .wp-block-cover .wp-block-paragraph {
font-size: 2.5rem;
}

.wp-block-cover + h2 {
font-size: var(--wp--preset--font-size--x-large);
}

.container-box img {
border-radius: 10px 0 0 10px;
}

.container-box.has-media-on-the-right img {
border-radius: 0 10px 10px 0;
}

.wp-block-media-text__content {
padding: 2rem !important;
}

.parent-pageid-13 .wp-block-cover__image-background {
background-size: 820px auto;
}

}