/* Sub-theme specific styling that overrides the base bon theme. */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');

html{

    font-family: var(--font-sans, Inter), ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

    --tw-text-opacity: 1;

    color: rgb(17 24 39 / var(--tw-text-opacity, 1))
}

/* Main menu item styles */
.main-menu li a{

    font-size: 1.125rem;

    line-height: 1.75rem;

    color: var(--color-secondary)
}
.main-menu li a:hover{

    color: var(--color-secondary-darker);

    text-decoration-line: none
}

/* Header menu item styles */
.header-menu li a{

    color: inherit;

    --tw-text-opacity: 1;

    color: rgb(55 65 81 / var(--tw-text-opacity, 1))
}
.header-menu li a:hover{

    --tw-text-opacity: 1;

    color: rgb(31 41 55 / var(--tw-text-opacity, 1));

    text-decoration-line: underline
}

/* Headers */
h1, h2, h3, h4{

    color: var(--color-secondary)
}

/* Discount image styling */
.discount-image{

    position: absolute;

    top: -0.5rem;

    left: -0.5rem;

    height: 5rem;

    width: 5rem;

    -o-object-fit: contain;

       object-fit: contain
}

/* Only apply intro paragraph style when body has multiple paragraphs */
article .content .body p:first-child{

    font-size: 1rem;

    line-height: 1.5rem
}

article .content .body:has(p:nth-child(2)) p:first-child{

    font-size: 1.25rem;

    line-height: 1.75rem
}