/*
 * Stoehr Custom — site-wide CSS
 *
 * Migrated from Appearance > Customize > Additional CSS so it ships
 * with code, is reviewable, and survives theme changes.
 *
 * Two parts of the original CSS were promoted to real block styles
 * (registered in src/Blocks.php::register_block_styles()):
 *   - .button-invert        -> core/accordion-heading "is-style-invert"
 *   - #accordion-item-3..6  -> core/accordion-heading is-style-{camera,target,users,briefcase}
 */

/* ---------- Globals ---------- */

*,
body {
    scroll-behavior: smooth !important;
}

h2, #karin {
    scroll-margin-top: 6rem;
}

header > div {
    --tw-backdrop-blur: blur(var(--blur-sm));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
}

header .wp-block-social-links::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 1em;
  background: #000;
  margin-right: 15px;
  vertical-align: middle;
}

.wp-block-group.is-position-sticky {
    position: fixed;
    width: 100%;
}

/* ---------- Forminator form ---------- *
 * The form is rendered with `forminator-design--basic`, which intentionally
 * ships no input/label styling. These rules restore the look we had in the
 * old Customizer "Additional CSS": medium-padded bordered inputs that turn
 * gold on hover/focus, and a square gold submit button matching our standard
 * core/button look. Submit button styling is fully self-contained here
 * because the Forminator button no longer carries the .wp-block-button__link
 * .wp-element-button classes.
 */

.forminator-input,
.forminator-textarea {
    width: 100%;
    box-sizing: border-box;
    padding-top: calc(0.667em + 2px) !important;
    padding-right: calc(1.333em + 2px) !important;
    padding-bottom: calc(0.667em + 2px) !important;
    padding-left: calc(1.333em + 2px) !important;
    background-color: #fff;
    border: 1px solid var(--wp--preset--color--neutral, #d4d4d4);
    border-radius: 0;
    transition: border-color 0.2s ease;
}

.forminator-input:hover,
.forminator-textarea:hover,
.forminator-input:focus,
.forminator-textarea:focus,
.forminator-field.forminator-has_error .forminator-input,
.forminator-field.forminator-has_error .forminator-textarea {
    outline: none;
    border-color: #c49d2f;
}

.forminator-label {
    display: block;
    margin-bottom: 0.5em;
}

/* Specificity bumped to .forminator-ui.forminator-custom-form … so we
 * beat Forminator's basic-design rules (e.g. `.forminator-ui
 * .forminator-design--basic .forminator-button.forminator-button-submit`)
 * without having to reach for !important. */
form.forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit {
    padding-top: calc(0.667em + 2px) !important;
    padding-right: calc(1.333em + 2px) !important;
    padding-bottom: calc(0.667em + 2px) !important; 
    padding-left: calc(1.333em + 2px) !important;
    width: 100%;
    border: 0;
    border-radius: 0;
    background-color: var(--wp--preset--color--custom-gold, #c8a86b);
    color: var(--wp--preset--color--white, #fff);
    cursor: pointer;
    transition: background-color 0.35s ease, transform 0.2s ease;
}

form.forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit:hover,
form.forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit:active,
form.forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit:focus {
    background-color: #c49d2f;
    color: var(--wp--preset--color--white, #fff);
}

/* Negative offset for the "about me" sidechain layout. Only applied
 * from tablet up — on narrow viewports the shift pushes the block off
 * the left edge and overlaps the window. */
@media (min-width: 768px) {
    .sidechain {
        position: relative;
        left: -5em;
    }
}

/* ---------- Default button hover/active ---------- *
 * Scoped to buttons that have NOT had a colour set in the inspector
 * (WP adds .has-text-color / .has-background when the editor sets one),
 * so per-block colour overrides from the editor still win.
 */

.wp-block-button__link.wp-element-button {
    border-width: 0;
    transition: background-color 0.35s ease, transform 0.2s ease;
}

.wp-block-button__link.wp-element-button:not(.has-text-color) {
    color: var(--wp--preset--color--white);
}

.wp-block-button__link.wp-element-button:not(.has-background):hover,
.wp-block-button__link.wp-element-button:not(.has-background):active {
    background-color: #c49d2f;
}

/* ---------- Block style: core/accordion-heading "Invert" ---------- */
/* Registered in Blocks.php as is-style-invert. Targets the inner
 * <button class="wp-block-accordion-heading__toggle"> — that's the
 * visible element; the heading itself is just an h3 wrapper. */

.wp-block-accordion-heading.is-style-invert .wp-block-accordion-heading__toggle {
    background-color: #fff !important;
    color: #d4af37 !important;
}

/* ---------- RTR image overlay block ---------- *
 * NOTE: duplicates CSS shipped by vendor/rtr/image-overlay-block. Kept
 * defensively; if the package stylesheet is confirmed loading on every
 * affected page, this whole block can be deleted in a follow-up.
 */

.wp-block-rtr-image-overlay {
    position: relative;
    overflow: hidden;
}

.wp-block-rtr-image-overlay__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: scale 500ms ease;
    transform-origin: center;
}

.wp-block-rtr-image-overlay__overlay {
    position: absolute;
    inset: 0;
    transition: background-color 300ms ease, opacity 300ms ease;
}

.wp-block-rtr-image-overlay__content {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 300ms ease, opacity 300ms ease;
    z-index: 2;
}

.wp-block-rtr-image-overlay__link {
    position: absolute;
    inset: 0;
    z-index: 3;
}

@media (hover: hover) {
    .wp-block-rtr-image-overlay:hover .wp-block-rtr-image-overlay__image {
        scale: 1.1;
    }

    .wp-block-rtr-image-overlay:hover .wp-block-rtr-image-overlay__overlay {
        background-color: rgb(0 0 0 / 0.4) !important;
    }
}

/* ---------- Accordion item layout ---------- *
 * Toggle: flex container so icon + title + plus sit on one row.
 */

.wp-block-accordion-item .wp-block-accordion-heading__toggle {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.wp-block-accordion-item .wp-block-accordion-heading__toggle-title {
    flex: 1;
}

/* ---------- Block styles: core/accordion-heading icons ---------- *
 * Registered in Blocks.php as is-style-{camera,target,users,briefcase}.
 * Shared ::before placeholder is only emitted when one of the four
 * icon styles is applied — un-styled accordion headings get no leading
 * placeholder square.
 */

.wp-block-accordion-heading:is(.is-style-camera, .is-style-target, .is-style-users, .is-style-briefcase) .wp-block-accordion-heading__toggle::before {
    content: "";
    display: inline-block;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    background-color: var(--wp--preset--color--custom-gold, #c8a86b);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: contain;
            mask-size: contain;
}

.wp-block-accordion-heading.is-style-camera .wp-block-accordion-heading__toggle::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z'/%3E%3Ccircle cx='12' cy='13' r='3'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z'/%3E%3Ccircle cx='12' cy='13' r='3'/%3E%3C/svg%3E");
}

.wp-block-accordion-heading.is-style-target .wp-block-accordion-heading__toggle::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E");
}

.wp-block-accordion-heading.is-style-users .wp-block-accordion-heading__toggle::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

.wp-block-accordion-heading.is-style-briefcase .wp-block-accordion-heading__toggle::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16'/%3E%3Crect width='20' height='14' x='2' y='6' rx='2'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16'/%3E%3Crect width='20' height='14' x='2' y='6' rx='2'/%3E%3C/svg%3E");
}