/*
 * Base element styles carried over from the former Hello Elementor theme
 * (reset.css) and the Elementor kit (global button styles).
 * The shortcode based UIs (rental process, cart, checkout, account) rely on them.
 *
 * Layered above the Bricks defaults but below every Bricks element, class and
 * theme style setting, so anything set in the builder still wins.
 */
@layer bricks, sh-base;

@layer sh-base {
    body {
        color: #333;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        font-size: 16px;
        font-weight: 400;
        line-height: 1.5;
        overflow-x: clip;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: inherit;
        line-height: 1.2;
        margin-block: 0;
    }

    h5 {
        font-size: 20px;
    }

    h6 {
        font-size: 16px;
    }

    p {
        margin-block: 0 14.4px;
    }

    /* Elementor containers and widgets have min-width: 0, so flex rows shrink their items evenly */
    [class*="brxe-"] {
        min-width: 0;
    }

    /* Bricks headings / basic text rendered as <p> keep the widget spacing (none) */
    p.brxe-heading,
    p.brxe-text-basic {
        margin-block: 0;
    }

    a {
        background-color: transparent;
        color: #c36;
        text-decoration: none;
    }

    a:active,
    a:hover {
        color: #336;
    }

    a:not([href]):not([tabindex]),
    a:not([href]):not([tabindex]):focus,
    a:not([href]):not([tabindex]):hover {
        color: inherit;
        text-decoration: none;
    }

    .brxe-heading a,
    .brxe-nav-menu a,
    a.brxe-block,
    a.brxe-div,
    a.brxe-container,
    a.brxe-image,
    a.brxe-logo,
    a.brxe-icon,
    a.bricks-button,
    a.brxe-text-link {
        color: inherit;
    }

    b,
    strong {
        font-weight: bolder;
    }

    img {
        border-style: none;
        height: auto;
        max-width: 100%;
    }

    label {
        color: inherit;
        display: inline-block;
        line-height: 1;
        margin-bottom: 0;
        vertical-align: middle;
    }

    button,
    input,
    optgroup,
    select,
    textarea {
        font-family: inherit;
        font-size: 16px;
        line-height: 1.5;
        margin: 0;
    }

    input[type=date],
    input[type=email],
    input[type=number],
    input[type=password],
    input[type=search],
    input[type=tel],
    input[type=text],
    input[type=time],
    input[type=url],
    select,
    textarea {
        border: 1px solid #666;
        border-radius: 3px;
        color: FieldText;
        padding: 8px 16px;
        transition: all 0.3s;
        width: 100%;
    }

    input[type=date]:focus,
    input[type=email]:focus,
    input[type=number]:focus,
    input[type=password]:focus,
    input[type=search]:focus,
    input[type=tel]:focus,
    input[type=text]:focus,
    input[type=time]:focus,
    input[type=url]:focus,
    select:focus,
    textarea:focus {
        border-color: #333;
    }

    select {
        display: block;
    }

    textarea {
        overflow: auto;
        resize: vertical;
    }

    [type=checkbox],
    [type=radio] {
        box-sizing: border-box;
        padding: 0;
    }

    /* Elementor kit button style (applied to all native buttons) */
    .bricks-button:not(.brxe-button) {
        background-color: var(--bricks-color-secondary, #dc0811);
        border-radius: 12px;
        color: var(--bricks-color-accent, #fff);
        font-family: "Inter", sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 1;
        padding: 14px 32px;
    }

    /* Hello Elementor button base (the kit colors live in theme.css) */
    :is(button, [type=button], [type=submit]):not(.bricks-mobile-menu-toggle, .splide__arrow, .splide__pagination__page, .brx-toggle-div) {
        -webkit-appearance: button;
        border: 1px solid #c36;
        display: inline-block;
        text-align: center;
        transition: all 0.3s;
        user-select: none;
        white-space: nowrap;
        width: auto;
    }

    :is(button, [type=button], [type=submit]):not(:disabled) {
        cursor: pointer;
    }

    fieldset {
        padding: 0.35em 0.75em 0.625em;
    }

    table {
        background-color: transparent;
        border-collapse: collapse;
        border-spacing: 0;
        font-size: 0.9em;
        margin-block-end: 15px;
        width: 100%;
    }

    table td,
    table th {
        border: 1px solid hsla(0, 0%, 50%, 0.502);
        line-height: 1.5;
        padding: 15px;
        vertical-align: top;
    }

    table th {
        font-weight: 700;
    }

    table tbody > tr:nth-child(odd) > td,
    table tbody > tr:nth-child(odd) > th {
        background-color: hsla(0, 0%, 50%, 0.071);
    }

    table tbody tr:hover > td,
    table tbody tr:hover > th {
        background-color: hsla(0, 0%, 50%, 0.102);
    }

    dd,
    dl,
    dt,
    li,
    ol,
    ul {
        margin-block: 0;
    }
}
