/**
 * Image Scroll Zoom Styles
 */

/* Editor Styles - Fix visibility of controls in WordPress editor */
.editor-styles-wrapper .components-panel__body-title,
.block-editor-block-inspector .components-panel__body-title,
.components-panel__body .components-panel__body-title {
  color: #1e1e1e !important;
}

.editor-styles-wrapper .components-base-control__label,
.block-editor-block-inspector .components-base-control__label,
.components-panel__body .components-base-control__label {
  color: #1e1e1e !important;
}

.editor-styles-wrapper .components-base-control__help,
.block-editor-block-inspector .components-base-control__help,
.components-panel__body .components-base-control__help {
  color: #757575 !important;
}

.editor-styles-wrapper .components-toggle-control__label,
.block-editor-block-inspector .components-toggle-control__label {
  color: #1e1e1e !important;
}

.editor-styles-wrapper .components-select-control__label,
.block-editor-block-inspector .components-select-control__label {
  color: #1e1e1e !important;
}

.editor-styles-wrapper select,
.block-editor-block-inspector select,
.components-select-control__input {
  color: #1e1e1e !important;
  background-color: #fff !important;
  border: 1px solid #8c8f94 !important;
}

/* Toggle Control Styling */
.components-toggle-control .components-form-toggle {
  background-color: #fff !important;
  border: 2px solid #8c8f94 !important;
}

.components-toggle-control .components-form-toggle.is-checked {
  background-color: #2271b1 !important;
  border-color: #2271b1 !important;
}

.components-toggle-control .components-form-toggle__track {
  background-color: transparent !important;
}

.components-toggle-control .components-form-toggle__thumb {
  background-color: #8c8f94 !important;
}

.components-toggle-control
  .components-form-toggle.is-checked
  .components-form-toggle__thumb {
  background-color: #fff !important;
}

/* Select dropdown arrow */
.components-select-control__input {
  padding-right: 24px !important;
}

/* Input text color */
.components-base-control input,
.components-base-control select,
.components-base-control textarea {
  color: #1e1e1e !important;
  background-color: #fff !important;
}

/* Ensure images with scroll zoom have proper overflow handling */
.annual-report-scroll-zoom {
  overflow: hidden;
  position: relative;
}

.annual-report-scroll-zoom img {
  width: 100%;
  height: auto;
  display: block;
  transform-origin: center center;
  will-change: transform;
}

/* Smooth transitions for zoom effect */
.annual-report-scroll-zoom img {
  transition: transform 0.1s ease-out;
}

/* Full Width Image - Break out of parent containers */
.wp-block-image.annual-report-image-full-width,
.annual-report-image-full-width {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  position: relative;
  box-sizing: border-box;
}

/* Ensure it breaks out of any parent containers */
.wp-block-columns
  > .wp-block-column
  > .wp-block-image.annual-report-image-full-width,
.wp-block-group > .wp-block-image.annual-report-image-full-width,
.wp-block-cover > .wp-block-image.annual-report-image-full-width,
.container > .wp-block-image.annual-report-image-full-width,
.wp-block-column > .wp-block-image.annual-report-image-full-width {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Full width image content */
.annual-report-image-full-width img {
  width: 100%;
  height: auto;
  display: block;
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  .annual-report-scroll-zoom img {
    transform: none !important;
    transition: none !important;
  }
}