/*
 * BootHack block style variations — frontend + block editor canvas.
 *
 * Loaded via enqueue_block_assets (fires for both contexts).  In the block
 * editor the stylesheet is injected into the iframed content document (WP 5.8+)
 * so these rules apply only to the canvas, not the editor chrome.
 *
 * All rules use --bh-* custom properties with concrete fallback values so the
 * variations adapt to the active CSS framework without per-framework overrides.
 * Fallback values match Bootstrap 5 defaults.
 */

/* ==========================================================================
   core/button — Pill
   Fully rounded corners on any button regardless of the framework default.
   ========================================================================== */

.wp-block-button.is-style-pill .wp-block-button__link {
    border-radius: 50rem;
}

/* ==========================================================================
   core/button — Ghost
   Transparent background with a coloured border; text colour inherits from
   the button accent token.  Complements the core "Outline" variation which
   uses the current colour palette entry rather than the button token.
   ========================================================================== */

.wp-block-button.is-style-ghost .wp-block-button__link {
    background-color: transparent;
    border: 2px solid var( --bh-button-bg-color, #0d6efd );
    color: var( --bh-button-bg-color, #0d6efd );
}

.wp-block-button.is-style-ghost .wp-block-button__link:hover,
.wp-block-button.is-style-ghost .wp-block-button__link:focus {
    background-color: var( --bh-button-bg-color, #0d6efd );
    color: var( --bh-button-text-color, #ffffff );
}

/* ==========================================================================
   core/image — Shadow
   Elevates an image with a standard ambient shadow.
   ========================================================================== */

.wp-block-image.is-style-shadow img {
    box-shadow: 0 0.5rem 1rem rgba( 0, 0, 0, 0.15 );
}

/* ==========================================================================
   core/image — Frame
   Adds a thin border and inset padding, giving a framed-photograph feel.
   Background fills the padding gap so the frame is visible against any page
   background.
   ========================================================================== */

.wp-block-image.is-style-frame img {
    border: 2px solid var( --bh-border-color, #dee2e6 );
    padding: 0.5rem;
    background-color: var( --bh-body-bg, #ffffff );
    box-sizing: border-box;
}

/* ==========================================================================
   core/quote — Bordered
   Classic left-rule blockquote — a vertical accent bar with generous leading
   indent.  Strips top/right/bottom borders that some frameworks add by default
   so only the left rule is visible.
   ========================================================================== */

.wp-block-quote.is-style-bordered {
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 4px solid var( --bh-primary, #0d6efd );
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 1.25rem;
    padding-right: 0;
    margin-left: 0;
    background-color: transparent;
}

/* ==========================================================================
   core/quote — Accent
   Tinted background callout that draws the eye without full colour saturation.
   Uses --bh-primary-bg-subtle (defined on :root since 4.3.031 as a
   colour-mix of the primary over the body background; the #cfe2ff
   fallback matches Bootstrap 5's alias) with a matching left border for
   visual anchoring.
   ========================================================================== */

.wp-block-quote.is-style-accent {
    background-color: var( --bh-primary-bg-subtle, #cfe2ff );
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 4px solid var( --bh-primary, #0d6efd );
    padding: 1rem 1.25rem;
    border-radius: var( --bh-border-radius, 0.375rem );
    margin-left: 0;
}