/*
 * Editor Styles
 *
 * This file contains styles that are specifically applied within the
 * Block Editor (Gutenberg) to ensure the backend editing experience
 * closely matches the frontend appearance of the theme.
 *
 * These styles are loaded via `add_editor_style()` in `functions.php`.
 */

/*--------------------------------------------------------------
# Header and Top Bar
--------------------------------------------------------------*/
.wp-block-group.real-estate-top-bar {
  background: var(--wp--preset--color--topbar);
  padding: 10px;
}

/* 
* Combined and cleaned up styles for header columns.
* The clip-path creates a slanted edge effect.
*/
.wp-block-column.real-estate-block-container-logo {
  clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%);
  display: flex;
  background: var(--wp--preset--color--backmenu);
  height: 100px;
  justify-content: center;
  align-items: center;
  padding: 10px;
}

.wp-block-column.real-estate-block-container-menu {
  display: flex;
  background: var(--wp--preset--color--backmenu);
  color: var(--wp--preset--color--colormenu);
  height: 100px;
  padding: 10px;
  justify-content: center;
}


/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.wp-block-group.real-estate-footer {
  background: var(--wp--preset--color--backmenu);
  color: var(--wp--preset--color--colormenu);
  padding: 10px;
}

.wp-block-heading.real-estate-footer-heading {
  color: var(--wp--preset--color--colormenu);
  font-size: 18px;
  /* Removed redundant background color */
}


.real-estate-footer-copy {
  color: var(--wp--preset--color--colormenu);
  font-size: 18px;
  /* Removed redundant background color */
}

.real-estate-footer-copy a {
  color: inherit;
  text-decoration: underline;
}

.real-estate-footer-copy a:hover {
  color: var(--wp--preset--color--link-hover);
}

.real-estate-blocks-footer-tagline {
  margin-top: 10px;
  color: var(--wp--preset--color--colormenu);
  font-size: 18px;
  /* Removed redundant background color */
}

.real-estate-blocks-footer-first {
  padding-right: 20px;
  padding-bottom: 20px;
}


/*--------------------------------------------------------------
# Shape Effects
--------------------------------------------------------------*/
.wp-block-column.real-estate-block-container-left-of-menu {
  clip-path: polygon(33% 0, 100% 0, 100% 100%, 0 100%);
  display: flex;
  background: var(--wp--preset--color--backmenu);
  height: 100px;
  padding: 10px;
  justify-content: center;
}

.real-estate-column-shape-effect {
  clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%);
  background-color: var(--wp--preset--color--backmenu);
}

.wp-block-group .wp-block-columns .wp-block-column[style*="flex-basis:32px"] .wp-block-image {
  background-color: #808080;
  /* Cor cinza para o fundo do ícone */
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

.wp-block-group .wp-block-columns .wp-block-column[style*="flex-basis:32px"] .wp-block-image img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}


/*--------------------------------------------------------------
# Slider Editor Preview Override
--------------------------------------------------------------*/
/* Hide the actual functional slider in the editor */
.wp-block-group .slider-container {
  display: none !important;
}

/* Show the static editor preview block in the editor */
.wp-block-group .slider-editor-preview {
  display: block !important;
  text-align: center;
  /* Center the image within the preview block */
  border: 1px solid #eee;
  /* Optional: add a subtle border for visual clarity */
  padding: 5px;
  /* Optional: add some padding */
}

/* Ensure the image inside the preview block is fully visible and responsive */
.wp-block-group .slider-editor-preview img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto;
  /* Ensure image is centered */
}

/* Optional: Hide slider navigation buttons if they somehow appear */
.wp-block-group .slider-container .slider-prev,
.wp-block-group .slider-container .slider-next {
  display: none !important;
}