/*
 * Redemption method blocks, output by [bfsim_redeem_steps],
 * [bfsim_redeem_old_pass] and [bfsim_redeem_validity].
 *
 * Only what the theme does not already get right. Blocksy sizes an h2 for a
 * page-level title, which is too large for a section heading sitting under the
 * page's own h1 — and in two columns on a wide screen, that size pushed the two
 * blocks out of step. Colours come from the Blocksy palette rather than from
 * hex values, so a palette change carries these along.
 */

/* One frame for the three blocks: they sit side by side on a wide screen and
   stack on a phone, so they have to read as the same kind of object. */
.bfsim-redeem-block {
    padding       : 1.1rem 1.25rem;
    border        : 1px solid var( --theme-palette-color-3, #415161 );
    border-color  : rgba( 65, 81, 97, .22 );
    border-color  : color-mix( in srgb, var( --theme-palette-color-3, #415161 ) 22%, transparent );
    border-radius : 5px;
    height        : 100%;
}

/* The closing note is a reassurance, not an instruction: a tinted ground sets
   it apart without another border. The two declarations are a pair — the first
   is what older browsers keep, the second what current ones use, so the tint
   follows a palette change. */
.bfsim-redeem-validity {
    background : rgba( 65, 81, 97, .20 );
    background : color-mix( in srgb, var( --theme-palette-color-3, #415161 ) 20%, transparent );
}

.bfsim-redeem-block h2 {
    margin      : 0 0 .8em;
    font-size   : clamp( 1.2rem, 1.9vw, 1.5rem );
    line-height : 1.25;
    color       : var( --theme-palette-color-4, #2c3e50 );
    text-wrap   : balance;
}

.bfsim-redeem-block ol,
.bfsim-redeem-block ul {
    margin        : 0 0 1.1em;
    padding-inline-start : 1.4em;
}

.bfsim-redeem-block li {
    margin-bottom : .45em;
}

.bfsim-redeem__lead {
    margin : 1.2em 0 .5em;
}

/* The three entry points are the point of the block: give them room and let
   them read as choices rather than as a continuation of the numbered steps. */
.bfsim-redeem__simulators {
    list-style : none;
    padding-inline-start : 0;
}

.bfsim-redeem__simulators li {
    margin-bottom : .35em;
}

.bfsim-redeem__upgrade,
.bfsim-redeem-old-pass__reassure {
    margin : 1.2em 0 0;
}