/*
Theme Name: defending-ed
*/

/* ==========================================================================
    Adapted From Ollie
   ========================================================================== */

/* CSS Reset
---------------------------------------------------------------------------- */

*,
*::before,
*::after {
    box-sizing: inherit;
}

html {
    box-sizing: border-box;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

b,
strong {
    font-weight: var(--wp--custom--font-weight--semi-bold);
}

ol,
ul {
    padding: 0;
}

ol:where(:not([class*="wp-block"])),
ol:where(.wp-block-list),
ul:where(:not([class*="wp-block"])),
ul:where(.wp-block-list) {
    padding-inline-start: var(--wp--preset--spacing--medium);
}

div[class*="wp-block-"] figcaption {
    color: var(--wp--preset--color--main-light);
    font-size: var(--wp--preset--font-size--x-small);
    margin-bottom: 0;
    margin-top: var(--wp--preset--spacing--x-small);
}

img,
figure {
    max-width: 100%;
    height: auto;
}

/* Standardize form styling
--------------------------------------------- */

input,
button,
textarea,
select {
    font: inherit;
}

input[type="button"],
input[type="email"],
input[type="search"],
input[type="submit"],
input[type="text"],
textarea {
    -webkit-appearance: none;
}

input:not([type="submit"]),
select,
textarea,
.wp-block-post-comments-form input:not([type="submit"]):not([type="checkbox"]),
.wp-block-post-comments-form textarea {
    color: var(--wp--preset--color--main);
    border-radius: 5px;
    border: solid 1px var(--wp--preset--color--border-light);
    padding: 0.5em 1em;
    font-size: var(--wp--preset--font-size--small);
}

input:focus-visible,
textarea:focus-visible {
    outline-color: var(--wp--preset--color--primary);
}

select:not([multiple]):not([size]),
select:not([multiple])[size="0"],
select:not([multiple])[size="1"] {
    -webkit-appearance: none;
    appearance: none;
    padding-right: 2em;
    background-image: var(--select-chevron);
    background-position: right 0.5em center;
    background-repeat: no-repeat;
    background-size: 1em;
}

select:not([multiple]):not([size]):dir(rtl),
select:not([multiple])[size="0"]:dir(rtl),
select:not([multiple])[size="1"]:dir(rtl) {
    padding-left: 2em;
    padding-right: 1em;
    background-position: left 0.5em center;
}

@media (forced-colors: active) {
    select:not([multiple]):not([size]),
    select:not([multiple])[size="0"],
    select:not([multiple])[size="1"] {
        -webkit-appearance: auto;
        appearance: auto;
        background-image: none;
    }
}

input[type="checkbox"],
input[type="image"],
input[type="radio"] {
    width: auto;
}

label {
    width: 100%;
    display: block;
}

::placeholder {
    color: var(--wp--preset--color--main-light);
    font-size: var(--wp--preset--font-size--small);
    opacity: 0.75;
}

/* Helper styles that can't be done via theme.json
---------------------------------------------------------------------------- */

a.more-link {
    display: block;
}

/* Inline code */
*:not(.wp-block-code) > code {
    background-color: var(--wp--preset--color--tertiary);
    font-weight: var(--wp--custom--font-weight--medium);
    padding: 3px 5px;
    position: relative;
    border-radius: 3px;
}

/* Adjust terms at bottom of posts */
.single .wp-block-group .wp-block-post-terms,
.blog .wp-block-group .wp-block-post-terms {
    margin-bottom: -8px !important;
}

/* Remove margin on term description on archive pages */
.wp-block-term-description p:last-child {
    margin-bottom: 0;
}

/* Remove last separator on post list */
.remove-border-and-padding .wp-block-post-template li:last-child .wp-block-separator {
    display: none;
}

/* Hide post meta div if no tags assigned */
.single .wp-block-group:has(> .post-meta:empty) {
    display: none;
}

.wp-block-group:empty:has(+ .comment-respond) {
    display: none;
}

.row-logos > figure {
    flex-shrink: 1 !important;
}

/* ==========================================================================
   Additional Styles
   ========================================================================== */

/* Variables
---------------------------------------------------------------------------- */

:root {
    --corner-peek-size: 4rem;
    --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23252532' stroke-width='2'/%3E%3C/svg%3E");
    --transition: 0.15s ease-in-out;
    --transition-slow: 0.3s ease-in-out;
}

/* Corner Peek
---------------------------------------------------------------------------- */

.corner-peek {
    background: var(--wp--preset--color--base);
    border-bottom-right-radius: inherit;
    bottom: 0;
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
    display: block;
    height: var(--corner-peek-size);
    margin: 0 !important;
    pointer-events: none;
    position: absolute;
    right: 0;
    transform: translate(2px, 1px);
    width: var(--corner-peek-size);
    z-index: 4;
}

.corner-peek::before {
    background: var(--corner-peek-color, var(--wp--preset--color--secondary-accent));
    border-radius: 50%;
    bottom: 0.5rem;
    content: "";
    height: 1.5rem;
    position: absolute;
    right: 0.5rem;
    width: 1.5rem;
}

.corner-peek::after {
    background: url("assets/images/icon-chevron-right.svg") no-repeat center / contain;
    bottom: 1rem;
    content: "";
    height: 0.5rem;
    position: absolute;
    right: 1.0625rem;
    width: 0.3125rem;
}

/* Scrolling
---------------------------------------------------------------------------- */

html {
    scroll-behavior: smooth;
}

/* assuming header is fixed, add scroll offset based on header height + some spacing */
:target {
    scroll-margin-top: calc(var(--site-header--height-pinned) + var(--wp--preset--spacing--medium));
}

/* Typography
---------------------------------------------------------------------------- */

b,
strong {
    font-weight: var(--wp--custom--font-weight--bold);
}

/* Buttons
---------------------------------------------------------------------------- */

/* These variables inherit through nested containers and button color settings. */
:root {
    --outline-button-hover-color: var(--wp--preset--color--base);
}

.has-primary-color {
    --outline-button-color: var(--wp--preset--color--primary);
}

.has-primary-light-color {
    --outline-button-color: var(--wp--preset--color--primary-light);
}

.has-primary-dark-color {
    --outline-button-color: var(--wp--preset--color--primary-dark);
}

.has-main-color {
    --outline-button-color: var(--wp--preset--color--main);
}

.has-main-light-color {
    --outline-button-color: var(--wp--preset--color--main-light);
}

.has-secondary-color {
    --outline-button-color: var(--wp--preset--color--secondary);
}

.has-primary-accent-color {
    --outline-button-color: var(--wp--preset--color--primary-accent);
}

.has-secondary-accent-color {
    --outline-button-color: var(--wp--preset--color--secondary-accent);
}

.has-tertiary-color {
    --outline-button-color: var(--wp--preset--color--tertiary);
}

.has-border-light-color {
    --outline-button-color: var(--wp--preset--color--border-light);
}

.has-border-dark-color {
    --outline-button-color: var(--wp--preset--color--border-dark);
}

.has-base-color {
    --outline-button-color: var(--wp--preset--color--base);
}

.has-base-alt-color {
    --outline-button-color: var(--wp--preset--color--base-alt);
}

.has-text-color:not(.has-base-color) {
    --outline-button-hover-color: var(--wp--preset--color--base);
}

.has-base-color {
    /* Resolve the nearest background at the button, not at this ancestor. */
    --outline-button-hover-color: initial;
}

.has-primary-background-color {
    --outline-button-container-background: var(--wp--preset--color--primary);
}

.has-primary-light-background-color {
    --outline-button-container-background: var(--wp--preset--color--primary-light);
}

.has-primary-dark-background-color {
    --outline-button-container-background: var(--wp--preset--color--primary-dark);
}

.has-main-background-color {
    --outline-button-container-background: var(--wp--preset--color--main);
}

.has-main-light-background-color {
    --outline-button-container-background: var(--wp--preset--color--main-light);
}

.has-secondary-background-color {
    --outline-button-container-background: var(--wp--preset--color--secondary);
}

.has-primary-accent-background-color {
    --outline-button-container-background: var(--wp--preset--color--primary-accent);
}

.has-secondary-accent-background-color {
    --outline-button-container-background: var(--wp--preset--color--secondary-accent);
}

.has-tertiary-background-color {
    --outline-button-container-background: var(--wp--preset--color--tertiary);
}

.has-border-light-background-color {
    --outline-button-container-background: var(--wp--preset--color--border-light);
}

.has-border-dark-background-color {
    --outline-button-container-background: var(--wp--preset--color--border-dark);
}

.has-base-background-color {
    --outline-button-container-background: var(--wp--preset--color--base);
}

.has-base-alt-background-color {
    --outline-button-container-background: var(--wp--preset--color--base-alt);
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
    border: 2px solid transparent;
}

:where(.wp-block-button__link, .wp-element-button) {
    padding: 0.5em 1em;
    text-decoration: none;
    transition: all var(--transition);
}

:where(.wp-block-button__link, .wp-element-button):hover {
    filter: brightness(110%);
}

:where(.wp-block-button__link, .wp-element-button) a {
    text-decoration: none;
}

.wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent !important;
    border-color: currentColor;
    border-style: solid;
    border-width: 2px;
    color: var(--outline-button-color, var(--wp--preset--color--secondary-accent));
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background: var(--outline-button-color, var(--wp--preset--color--secondary-accent)) !important;
    border-color: var(--outline-button-color, var(--wp--preset--color--secondary-accent));
    color: var(
        --outline-button-hover-color,
        var(--outline-button-container-background, var(--wp--preset--color--main))
    ) !important;
    filter: none;
}

.wp-block-button.is-style-simple {
    line-height: 1.1;
}

.wp-block-button.is-style-simple .wp-block-button__link {
    background: initial;
    border: initial;
    color: inherit;
    display: inline;
    padding: 0;
    position: relative;
    text-align: inherit;
}

.wp-block-button.is-style-simple .wp-block-button__link::before {
    background-color: currentColor;
    content: "";
    display: inline-block;
    height: 0.5em;
    width: 0.5em;
    --de-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 8'%3E%3Cpath d='M0.510079 0.508557C0.423001 0.594691 0.375 0.709359 0.375 0.831407C0.375 0.953455 0.423001 1.06805 0.510079 1.15418L3.26067 3.87493L0.509849 6.59591C0.330384 6.77374 0.330384 7.06303 0.509849 7.24093C0.596927 7.32722 0.712776 7.37485 0.836086 7.375C0.959396 7.37515 1.0754 7.32775 1.16286 7.24139L4.23961 4.19801C4.32569 4.11309 4.375 3.99523 4.375 3.87478C4.375 3.75433 4.32569 3.63692 4.23984 3.55216L1.16278 0.508481C0.982858 0.330506 0.690006 0.330582 0.510079 0.508557Z' fill='currentColor' stroke='currentColor' stroke-width='0.75'/%3E%3C/svg%3E");
    -webkit-mask: var(--de-mask-image) no-repeat right center / 0.5em 0.5em;
    mask: var(--de-mask-image) no-repeat right center / 0.5em 0.5em;
    position: absolute;
    bottom: 0.65ex;
    right: 0;
    transition: all var(--transition);
}

.wp-block-button.is-style-simple .wp-block-button__link::after {
    /* Keep the reserved icon space attached to the final word. */
    content: "\00a0";
    display: inline;
    padding-left: 0.1em;
    padding-right: 0.5em;
}

.wp-block-button.is-style-simple .wp-block-button__link:hover {
    filter: none;
}

.wp-block-button.is-style-simple .wp-block-button__link:hover::before {
    right: -0.1em;
}

/* Block Styles
---------------------------------------------------------------------------- */

div.is-style-bg-brand-gradient {
    position: relative;
    background:
        url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22200%22%20height%3D%22200%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.80%22%20numOctaves%3D%223%22%20stitchTiles%3D%22stitch%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url(%23n)%22%20opacity%3D%220.3%22%2F%3E%3C%2Fsvg%3E"),
        linear-gradient(130deg, var(--wp--preset--color--primary) 1.69%, var(--wp--preset--color--secondary) 183.48%);
}

div.is-style-bg-green-gradient {
    position: relative;
    background:
        url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22200%22%20height%3D%22200%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.80%22%20numOctaves%3D%223%22%20stitchTiles%3D%22stitch%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url(%23n)%22%20opacity%3D%220.2%22%2F%3E%3C%2Fsvg%3E"),
        linear-gradient(180deg, var(--wp--preset--color--secondary-accent) 0%, #004539 100%);
}

div.is-style-bg-noise {
    background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22200%22%20height%3D%22200%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.80%22%20numOctaves%3D%223%22%20stitchTiles%3D%22stitch%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url(%23n)%22%20opacity%3D%220.2%22%2F%3E%3C%2Fsvg%3E");
}

div.is-style-bg-brand-book {
    position: relative;
    overflow: clip;
}

div.is-style-bg-brand-book > * {
    position: relative;
}

div.is-style-bg-brand-book::before {
    background-color: var(--wp--preset--color--primary-dark);
    content: "";
    display: block;
    --de-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 15' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.9378 2.28601L6.33313 5.49267V14.0723C9.58502 13.351 11.9378 10.7085 11.9378 10.7085C12.0777 7.13818 11.9378 2.28601 11.9378 2.28601Z' fill='%2305549E'/%3E%3Cpath d='M0.0622125 2.28601L5.66684 5.49145V14.0711C2.41495 13.3498 0.0622125 10.7073 0.0622125 10.7073C-0.0777656 7.13818 0.0622125 2.28601 0.0622125 2.28601Z' fill='%2305549E'/%3E%3Cpath d='M6.04956 5.3858L9.97751 1.07581L9.98606 0L6.04956 5.3858Z' fill='%2305549E'/%3E%3Cpath d='M6.04956 5.38565L10.7385 2.10136L10.7544 0.759644L6.04956 5.38565Z' fill='currentColor'/%3E%3Cpath d='M6.06774 5.38445L1.38978 2.06043L1.38489 0.163086L6.06774 5.38445Z' fill='currentColor'/%3E%3C/svg%3E%0A");
    -webkit-mask: var(--de-mask-image) no-repeat center;
    mask: var(--de-mask-image) no-repeat center;
    -webkit-mask-size: auto 150%;
    mask-size: auto 150%;
    -webkit-mask-position: right calc(-1 * var(--wp--preset--spacing--x-large)) top var(--wp--preset--spacing--large);
    mask-position: right calc(-1 * var(--wp--preset--spacing--x-large)) top var(--wp--preset--spacing--large);
    height: 100%;
    inset: 0;
    opacity: 0.2;
    position: absolute;
    width: 100%;
}

.has-tertiary-background-color.is-style-bg-brand-book::before {
    background-color: var(--wp--preset--color--main);
    opacity: 0.03;
}

/* Handle Logo Images Generally
---------------------------------------------------------------------------- */

.image--is-logo {
    --image-logo-padding: var(--wp--preset--spacing--medium);
    background-color: var(--wp--preset--color--base);
    padding: var(--image-logo-padding);
    position: relative;
}

.image--is-logo img {
    height: calc(100% - (2 * var(--image-logo-padding)));
    inset: var(--image-logo-padding);
    object-fit: contain;
    position: absolute;
    width: calc(100% - (2 * var(--image-logo-padding)));
}

/* Handle end-of-page margin edge cases
---------------------------------------------------------------------------- */

.page-template-default .post-template:has(.entry-content > .cta--report-incident:last-child) + .site-ctas {
    margin-top: calc((-1 * var(--wp--preset--spacing--xx-large)) + var(--wp--preset--spacing--large)) !important;
}

/* Adjust sticky position element position
---------------------------------------------------------------------------- */

.is-position-sticky {
    top: calc(var(--site-header--height-pinned) + var(--wp--preset--spacing--medium)) !important;
}

/* Page hero (replicates post hero styles in a class)
---------------------------------------------------------------------------- */

div.page-hero {
    margin-inline: calc(var(--wp--style--root--padding-right) * -1) !important;
}

@media (min-width: 1300px) {
    div.page-hero {
        border-radius: var(--wp--preset--border-radius--default);
        margin-inline: auto !important;
    }
}
