@import './risk-generator-input.css';

.c-risk-generator {
    display: block;
    padding: 0 calc(100% / 12 / 2) 0;
    width: 100%;
}
.c-risk-generator__title {
    margin: 0;
}
.c-risk-generator__title::after {
    content: unset;
}
.c-risk-generator__subtitle {
    margin: 0;
    font-weight: bold;
    font-size: 1.25rem
}
.c-risk-generator__tool {
    display: block;
}
.c-risk-generator__inputs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.75rem;
    padding: 0 calc(100% / 12 * 1.25);
}
.c-risk-generator__results {
    margin: 2.5rem auto 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 800px;
    text-align: center;
}
.c-risk-generator__results-container {
    display: none;
}
.c-risk-generator__results-container.is-visible {
    display: block;
}
.c-risk-generator__radon-risk {
    width: 100%;
    padding: 2rem 3rem;
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.6;
    text-align: center;
    border: 2px solid var(--uofc-red);
    border-radius: 50px;
}
.c-risk-generator__radon-risk-value {
    color: var(--uofc-red);
    font-size: 1.5rem;
}
.c-risk-generator__disclaimer {
    font-weight: 500;
}
.c-risk-generator-disclaimer__content {
    font-size: 1.25rem;
}
.c-risk-generator-disclaimer__asterisk {
    color: var(--uofc-red);
}
.c-risk-generator__region-map * {
    fill: #fff;
    stroke: #000;
    transition: fill 200ms ease-out;
}
/*.c-risk-generator__region-map #nunavut {*/
/*    fill: var(--brand-grey);*/
/*    cursor: not-allowed;*/
/*    pointer-events: none;*/
/*}*/
.c-risk-generator__house-type,
.c-risk-generator__community {
    margin-bottom: 2rem;
}
.c-risk-generator__input-picker g {
    font-size: 8px;
    fill: var(--risk-generator-svg-text-color, #000);
}
.c-risk-generator__community g {
    font-size: 75px;
}
.c-risk-generator__input-picker g:hover {
    --risk-generator-svg-text-color: var(--uofc-red);
}
.c-risk-generator__region-map g:hover *,
.c-risk-generator__region-map g:focus *,
.c-risk-generator__region-map g.is-selected *,
.c-risk-generator__input-picker g:hover .c-risk-generator__input-highlight,
.c-risk-generator__input-picker g:focus .c-risk-generator__input-highlight,
.c-risk-generator__input-picker g.is-selected .c-risk-generator__input-highlight,
.c-risk-generator__community g:hover *,
.c-risk-generator__community g:focus *,
.c-risk-generator__community g.is-selected *{
    fill: var(--uofc-red);
    cursor: pointer;
}
.c-risk-generator__house-type-disclaimer {
    margin: 0 0 2rem;
}
.radon-risk-generator-region__metros {
    display: none;
    margin: 0 0 1.5rem;
}
.radon-risk-generator-region__metro-option {
    display: none;
}
.radon-risk-generator-region__metro-options {
    margin-top: 0.75rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.c-risk-generator-metro-btn {
    display: inline-block;
    padding: 0.35rem 1rem;
    background: var(--risk-generator-input-btn-bg-color, #000);
    color: var(--risk-generator-input-btn-color, #fff);
    font-weight: 500;
    border: 2px solid var(--risk-generator-input-border-bg-color, #000);
    cursor: pointer;
}
.c-risk-generator-metro-btn:hover,
.c-risk-generator-metro-btn:focus {
    --risk-generator-input-btn-color: #000;
    --risk-generator-input-btn-bg-color: #fff;
    --risk-generator-input-border-bg-color: #000;
}
.c-risk-generator-metro-btn.is-selected {
    --risk-generator-input-btn-bg-color: var(--uofc-red);
    --risk-generator-input-border-bg-color: var(--uofc-red);
    --risk-generator-input-btn-color: #fff;
}
.c-risk-generator__provinces {
    display: none;
}
.c-risk-generator__province-list {
    margin-top: 0.5rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
.c-risk-generator__province {
    display: flex;
    gap: 0.75rem;
    margin-top: 0.5rem;
    background-color: var(--ccr-light-grey);
    padding: 0.75rem;
    font-size: 1.125rem;
    text-align: left;
}
.c-risk-generator__province:only-child {
    grid-column: 1 / 3;
    justify-self: center;
    width: fit-content;
}
.c-risk-generator__province-details {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.c-risk-generator__province-score {
    display: inline-block;
    color: var(--uofc-red);
    font-weight: 500;
}
.c-risk-generator__province-avg {
    font-size: 1rem;
}
.c-risk-generator__options {
    margin-top: 4.5rem;
    padding: 1rem;
    border-top: 2px solid var(--uofc-red);
}
.c-risk-generator__simulation-disclaimer {
    visibility: hidden;
    font-size: 0.8rem;
    text-align: center;
    font-weight: 500;
    margin-bottom: -1rem;
}
.c-risk-generator__floor-simulation {
    margin-top: 1rem;
}
.c-risk-generator__floor-simulation {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 0.5rem;
}
.c-risk-generator__floor-simulation legend p,
.c-risk-generator__floor-simulation label p{
    margin-top: 0;
    font-size: 1rem;
    font-weight: 400;
}
.c-risk-generator__floor-simulation legend {
    font-size: 1rem;
    font-weight: 500;
}
.c-risk-generator__floor-simulation label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 1rem;
    font-weight: 400;
}
.c-risk-generator__floor-simulation input[type="radio"] {
    width: 20px;
    height: 20px;
    accent-color: var(--uofc-red);
}

@media screen and (max-width: 1000px) {
    .c-risk-generator {
        padding: 0 0 8rem;
    }
    .c-risk-generator__inputs {
        padding: 0
    }
}

@media screen and (max-width: 600px) {
    .c-risk-generator__inputs {
        grid-template-columns: 1fr;
    }
    .c-risk-generator-input__image {
        display: none;
    }
    .c-risk-generator__radon-risk p {
        font-size: 1.25rem;
    }
    .c-risk-generator__province-list {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}