/*!***************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./src/control-groups/typography/style.scss ***!
  \***************************************************************************************************************************************************************/
/**
 * Typography Control Group Styles
 *
 * SCSS styles for the TypographyControl component wrapped in PanelBody.
 * Provides consistent styling across different themes and accessibility modes.
 *
 * @package RedfoxThankYou
 * @since 1.0.0
 */
/**
 * Redfox Thank You Plugin - SCSS Mixins
 *
 * Reusable mixins for consistent styling across the plugin
 * These mixins should be generic and widely reusable
 *
 * @package RedfoxThankYou
 * @since 1.0.0
 */
/**
 * Flexbox layouts
 */
/**
 * Common flex shortcuts
 */
/**
 * Positioning
 */
/**
 * Size helper
 */
/**
 * Square helper
 */
/**
 * Circle helper
 */
/**
 * Margin helpers
 */
/**
 * Padding helpers
 */
/**
 * Remove spacing
 */
/**
 * Border helpers
 */
/**
 * Background helpers
 */
/**
 * Font helpers
 */
/**
 * Text truncation
 */
/**
 * Screen reader text
 */
/**
 * Transition helper
 */
/**
 * Hover effects
 */
/**
 * Focus states
 */
/**
 * Base button styles
 */
/**
 * Button base with common styles
 */
/**
 * Icon button
 */
/**
 * Input field base
 */
/**
 * Label styles
 */
/**
 * Card/Panel styles
 */
/**
 * Card with default padding
 */
/**
 * Dropdown/Popover styles
 */
/**
 * Visibility helpers
 */
/**
 * Responsive breakpoints
 */
/**
 * Container with responsive behavior
 */
/**
 * Fade animations
 */
@keyframes fadeIn {
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  to {
    opacity: 0;
  }
}
/**
 * Slide animations
 */
@keyframes slideInUp {
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
/**
 * Clearfix for floated elements
 */
/**
 * Aspect ratio container
 */
/**
 * Scrollbar styling
 */
/**
 * CSS Triangle
 */
.redfox-thank-you-typography-control__font-style {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  border: 1px solid #ddd;
  border-radius: 2px;
}
.redfox-thank-you-typography-control__font-style > .redfox-thank-you-button-group {
  border: none;
  border-radius: 0;
  flex: 1 1 0;
}
.redfox-thank-you-typography-control__font-style > .redfox-thank-you-button-group:first-child {
  flex: 0 0 33.3333333333%;
}
/*!***************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./src/control-groups/background/style.scss ***!
  \***************************************************************************************************************************************************************/
/**
 * Background Control Group Styles
 *
 * SCSS styles for the BackgroundControl component wrapped in PanelBody.
 * Provides consistent styling across different themes and accessibility modes.
 *
 * @package RedfoxThankYou
 * @since 1.0.0
 */
/*!************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./src/control-groups/spacing/style.scss ***!
  \************************************************************************************************************************************************************/
/**
 * Spacing Control Group Styles
 *
 * SCSS styles for the spacing control group component using BoxControl
 * with responsive support.
 *
 * @package RedfoxThankYou
 * @since 1.0.0
 */
/**
 * Redfox Thank You Plugin - SCSS Mixins
 *
 * Reusable mixins for consistent styling across the plugin
 * These mixins should be generic and widely reusable
 *
 * @package RedfoxThankYou
 * @since 1.0.0
 */
/**
 * Flexbox layouts
 */
/**
 * Common flex shortcuts
 */
/**
 * Positioning
 */
/**
 * Size helper
 */
/**
 * Square helper
 */
/**
 * Circle helper
 */
/**
 * Margin helpers
 */
/**
 * Padding helpers
 */
/**
 * Remove spacing
 */
/**
 * Border helpers
 */
/**
 * Background helpers
 */
/**
 * Font helpers
 */
/**
 * Text truncation
 */
/**
 * Screen reader text
 */
/**
 * Transition helper
 */
/**
 * Hover effects
 */
/**
 * Focus states
 */
/**
 * Base button styles
 */
/**
 * Button base with common styles
 */
/**
 * Icon button
 */
/**
 * Input field base
 */
/**
 * Label styles
 */
/**
 * Card/Panel styles
 */
/**
 * Card with default padding
 */
/**
 * Dropdown/Popover styles
 */
/**
 * Visibility helpers
 */
/**
 * Responsive breakpoints
 */
/**
 * Container with responsive behavior
 */
/**
 * Fade animations
 */
@keyframes fadeIn {
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  to {
    opacity: 0;
  }
}
/**
 * Slide animations
 */
@keyframes slideInUp {
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
/**
 * Clearfix for floated elements
 */
/**
 * Aspect ratio container
 */
/**
 * Scrollbar styling
 */
/**
 * CSS Triangle
 */
.redfox-thank-you-spacing-control .components-box-control {
  margin-top: 0;
  margin-bottom: 16px;
}
.redfox-thank-you-spacing-control .components-box-control:last-child {
  margin-bottom: 0;
}
/*!***********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./src/control-groups/button/style.scss ***!
  \***********************************************************************************************************************************************************/
/**
 * Button Control Group Styles
 *
 * SCSS styles for the ButtonControl component interface
 *
 * @package RedfoxThankYou
 * @since 1.0.0
 */
.redfox-thank-you-button-control__group {
  margin-bottom: 0;
}
.redfox-thank-you-button-control__group .redfox-thank-you-panel-body__title {
  font-size: 13px;
  font-weight: 500;
}
.redfox-thank-you-button-control__group .redfox-thank-you-panel-body__title-row {
  padding: 12px 16px;
  min-height: 44px;
}
.redfox-thank-you-button-control__group .redfox-thank-you-panel-body__content {
  padding: 16px;
}
.redfox-thank-you-button-control__group--background .redfox-thank-you-panel-body__title::before {
  content: "";
}
.redfox-thank-you-button-control__group--text .redfox-thank-you-panel-body__title::before {
  content: "";
}
.redfox-thank-you-button-control__group--spacing .redfox-thank-you-panel-body__title::before {
  content: "";
}
.redfox-thank-you-button-control__group--border .redfox-thank-you-panel-body__title::before {
  content: "";
}
.redfox-thank-you-button-control__group--box-shadow .redfox-thank-you-panel-body__title::before {
  content: "";
}
.redfox-thank-you-button-control__responsive-tabs {
  margin-bottom: 16px;
}
.redfox-thank-you-button-control__responsive-tabs .components-button-group {
  display: flex;
  width: 100%;
}
.redfox-thank-you-button-control__header {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 16px;
}
.redfox-thank-you-button-control__reset {
  font-size: 12px !important;
  height: 28px !important;
  padding: 0 12px !important;
}
.redfox-thank-you-button-control__color-presets {
  margin-bottom: 16px;
}
.redfox-thank-you-button-control__preset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  gap: 8px;
  margin-top: 8px;
}
.redfox-thank-you-button-control__preset-button {
  padding: 8px 12px !important;
  border: 2px solid transparent !important;
  border-radius: 4px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-align: center;
  cursor: pointer;
  transition: all 0.15s ease;
}
.redfox-thank-you-button-control__preset-button:hover {
  opacity: 0.8;
}
.redfox-thank-you-button-control__preset-button.is-active {
  border-color: #007cba !important;
  box-shadow: 0 0 0 1px #007cba;
}
.redfox-thank-you-button-control__background-color, .redfox-thank-you-button-control__text-color, .redfox-thank-you-button-control__hover-background-color, .redfox-thank-you-button-control__hover-text-color, .redfox-thank-you-button-control__border-color, .redfox-thank-you-button-control__hover-border-color {
  margin-bottom: 12px;
}
.redfox-thank-you-button-control__background-color .components-color-picker, .redfox-thank-you-button-control__text-color .components-color-picker, .redfox-thank-you-button-control__hover-background-color .components-color-picker, .redfox-thank-you-button-control__hover-text-color .components-color-picker, .redfox-thank-you-button-control__border-color .components-color-picker, .redfox-thank-you-button-control__hover-border-color .components-color-picker {
  width: 100%;
}
.redfox-thank-you-button-control__background-color .components-base-control__field, .redfox-thank-you-button-control__text-color .components-base-control__field, .redfox-thank-you-button-control__hover-background-color .components-base-control__field, .redfox-thank-you-button-control__hover-text-color .components-base-control__field, .redfox-thank-you-button-control__border-color .components-base-control__field, .redfox-thank-you-button-control__hover-border-color .components-base-control__field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.redfox-thank-you-button-control__hover-toggle {
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e0e0e0;
}
.redfox-thank-you-button-control__hover-toggle .components-base-control__label {
  font-weight: 600;
  margin-bottom: 8px;
}
.redfox-thank-you-button-control__border-color, .redfox-thank-you-button-control__border-width, .redfox-thank-you-button-control__border-style, .redfox-thank-you-button-control__border-radius {
  margin-bottom: 12px;
}
.redfox-thank-you-button-control__border-color .components-range-control, .redfox-thank-you-button-control__border-width .components-range-control, .redfox-thank-you-button-control__border-style .components-range-control, .redfox-thank-you-button-control__border-radius .components-range-control {
  margin-bottom: 0;
}
.redfox-thank-you-button-control__border-color .components-select-control, .redfox-thank-you-button-control__border-width .components-select-control, .redfox-thank-you-button-control__border-style .components-select-control, .redfox-thank-you-button-control__border-radius .components-select-control {
  margin-bottom: 0;
}
.redfox-thank-you-button-control__size-presets {
  margin-bottom: 16px;
}
.redfox-thank-you-button-control__size-presets .components-button-group {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  width: 100%;
}
.redfox-thank-you-button-control__size-presets .components-button-group .components-button {
  flex: 1;
  min-width: 60px;
}
.redfox-thank-you-button-control__padding {
  margin-bottom: 16px;
}
.redfox-thank-you-button-control__padding .components-box-control .components-box-control__input-controls {
  gap: 8px;
}
.redfox-thank-you-button-control__padding .components-box-control .components-unit-control {
  min-height: 30px;
}
.redfox-thank-you-button-control__font-weight, .redfox-thank-you-button-control__text-transform, .redfox-thank-you-button-control__text-align, .redfox-thank-you-button-control__letter-spacing {
  margin-bottom: 12px;
}
.redfox-thank-you-button-control__font-weight .components-button-group, .redfox-thank-you-button-control__text-transform .components-button-group, .redfox-thank-you-button-control__text-align .components-button-group, .redfox-thank-you-button-control__letter-spacing .components-button-group {
  display: flex;
  gap: 2px;
  width: 100%;
}
.redfox-thank-you-button-control__font-weight .components-button-group .components-button, .redfox-thank-you-button-control__text-transform .components-button-group .components-button, .redfox-thank-you-button-control__text-align .components-button-group .components-button, .redfox-thank-you-button-control__letter-spacing .components-button-group .components-button {
  flex: 1;
}
.redfox-thank-you-button-control__font-weight .components-range-control, .redfox-thank-you-button-control__text-transform .components-range-control, .redfox-thank-you-button-control__text-align .components-range-control, .redfox-thank-you-button-control__letter-spacing .components-range-control {
  margin-bottom: 0;
}
.redfox-thank-you-button-control__font-weight .components-select-control, .redfox-thank-you-button-control__text-transform .components-select-control, .redfox-thank-you-button-control__text-align .components-select-control, .redfox-thank-you-button-control__letter-spacing .components-select-control {
  margin-bottom: 0;
}
.redfox-thank-you-button-control__width, .redfox-thank-you-button-control__height, .redfox-thank-you-button-control__min-width {
  margin-bottom: 12px;
}
.redfox-thank-you-button-control__width .components-range-control, .redfox-thank-you-button-control__height .components-range-control, .redfox-thank-you-button-control__min-width .components-range-control {
  margin-bottom: 0;
}
.redfox-thank-you-button-control .components-base-control {
  margin-bottom: 16px;
}
.redfox-thank-you-button-control .components-base-control:last-child {
  margin-bottom: 0;
}
.redfox-thank-you-button-control .components-color-picker .components-flex {
  margin-bottom: 8px;
}
.redfox-thank-you-button-control .components-color-picker .components-input-control {
  font-size: 12px;
}
.redfox-thank-you-button-control .components-color-picker .components-color-picker__saturation {
  margin-bottom: 8px;
}
.redfox-thank-you-button-control .components-color-picker .components-color-picker__hue {
  margin-bottom: 8px;
}
.redfox-thank-you-button-control .components-color-picker .components-color-picker__alpha {
  margin-bottom: 8px;
}
.redfox-thank-you-button-control .components-range-control .components-range-control__wrapper {
  margin-bottom: 0;
}
.redfox-thank-you-button-control .components-range-control .components-range-control__track {
  background: #e0e0e0;
}
.redfox-thank-you-button-control .components-range-control .components-range-control__thumb {
  background: #007cba;
  border-color: #007cba;
}
.redfox-thank-you-button-control .components-range-control .components-range-control__number {
  width: 60px !important;
  font-size: 12px;
}
.redfox-thank-you-button-control .components-button-group .components-button {
  border-radius: 0;
}
.redfox-thank-you-button-control .components-button-group .components-button:first-child {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.redfox-thank-you-button-control .components-button-group .components-button:last-child {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.redfox-thank-you-button-control .components-button-group .components-button.is-primary {
  background: #007cba;
  border-color: #007cba;
  color: #fff;
}
.redfox-thank-you-button-control > .components-base-control + .components-base-control {
  margin-top: 20px;
}
.redfox-thank-you-button-control__hover-controls, .redfox-thank-you-button-control__border-controls, .redfox-thank-you-button-control__size-controls, .redfox-thank-you-button-control__padding-controls, .redfox-thank-you-button-control__typography-controls, .redfox-thank-you-button-control__dimensions-controls {
  padding-top: 16px;
  border-top: 1px solid #e0e0e0;
}
.redfox-thank-you-button-control__hover-controls:first-child, .redfox-thank-you-button-control__border-controls:first-child, .redfox-thank-you-button-control__size-controls:first-child, .redfox-thank-you-button-control__padding-controls:first-child, .redfox-thank-you-button-control__typography-controls:first-child, .redfox-thank-you-button-control__dimensions-controls:first-child {
  padding-top: 0;
  border-top: none;
}
@media (max-width: 782px) {
  .redfox-thank-you-button-control__preset-grid {
    grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));
    gap: 6px;
  }
  .redfox-thank-you-button-control__preset-button {
    padding: 6px 8px !important;
    font-size: 11px !important;
  }
  .redfox-thank-you-button-control .components-button-group .components-button {
    font-size: 12px;
    padding: 6px 8px;
  }
}

.components-panel__body-content .block-editor-sidebar .redfox-thank-you-button-control {
  padding-right: 0;
  padding-left: 0;
}

.components-popover.components-color-picker__popover {
  z-index: 999999;
}

.redfox-thank-you-button-control .components-button:not(.is-primary):hover {
  border-color: #007cba;
  color: #007cba;
}
.redfox-thank-you-button-control .components-color-picker__swatch {
  border-radius: 2px;
  cursor: pointer;
  transition: transform 0.15s ease;
}
.redfox-thank-you-button-control .components-color-picker__swatch:hover {
  transform: scale(1.05);
}
