/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */

:root {
    --nys-accordion-content-max-width: 1080px;
}

.body-content {
    margin-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
    max-width: 280px;
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .body-content {
        padding: 0;
    }
}

.state-background {
    background-image: url('nborder.gif');
    background-repeat: repeat; /* This makes the image repeat */
    background-position: top; /* This centers the image */
    background-size: auto; /* 'auto' is the default, meaning the image's original size.
                           If you want it to cover the area, you might use 'cover'.
                           If you want it to be a specific size, you'd use pixel values or percentages. */
}

p {
    line-height: 1.05;
}

.text {
    line-height: 1.05;
    margin-top: 0.6em;
    margin-bottom: 0.6em;
    font-size: small;
}

.highlight {
    color: #B30000;
}

.center {
    text-align: center !important;
}

.hyperlink-button {
    background: none; /* Remove default button background */
    border: none; /* Remove default button border */
    padding: 0; /* Remove default button padding */
    margin: 0; /* Remove default button margin */
    font: inherit; /* Inherit font styles from the parent element */
    color: var(--nys-color-link); /* Set the color to blue, like a hyperlink */
    text-decoration: underline; /* Add underline, like a hyperlink */
    cursor: pointer; /* Show a pointer cursor on hover */
    outline: none; /* Remove outline on focus (optional, consider accessibility) */
}

    /* Style for when the link-button is hovered over */
    .hyperlink-button:hover {
        color: var(--nys-color-link-strong); /* Slightly darker blue on hover */
        text-decoration: none; /* Optionally remove underline on hover */
    }

    /* Style for when the link-button is clicked (active) */
    .hyperlink-button:active {
        color: purple; /* A different color when actively clicked */
    }

    /* Optional: Style for when the link-button has focus (important for accessibility) */
    .hyperlink-button:focus {
        outline: 1px dotted var(--nys-color-link); /* Add a visible outline for keyboard navigation */
    }

.outset-border {
    border: 0.2em var(--nys-color-neutral-500) outset;
}

.no-pad {
    padding: 0 0 0 0 !important; 
}

.no-marg {
    margin: 0 0 0 0 !important;
}

.solid-border {
    border: 0.1em solid black;
}
.solid-border-greyin {
    border: 0.1em solid black;
    background-color: var(--nys-color-neutral-100);
    font-weight: 500;
}

.solid-grey-border {
    border: 0.1em solid var(--nys-color-neutral-100);
}

.solid-grey-border-greyin {
    border: 0.1em solid var(--nys-color-neutral-100);
    background-color: var(--nys-color-neutral-100);
    font-weight: 500;
}

.nys-modal {
    width: 720px !important; /* Increase the default width */
    min-width: 720px !important; /* Optionally increase the min-width too */
    --_nys-modal-width: 720px !important; /* Increase the default width */
    --_nys-modal-min-width: 720px !important; /* Optionally increase the min-width too */
}