﻿#partial-tax-conversion-calculator label {
    margin: 0;
}

.symbol-right,
.symbol-left {
    position: absolute;
    top: 7px;
}

.symbol-right {
    right: 0.45rem;
}

.symbol-left {
    left: 0.45rem;
}

.has-symbol-right {
    padding-right: 1.25rem;
}

.has-symbol-left {
    padding-left: 1.25rem;
}

.ptc-banner {
    background-color: #0c6b71;
    color: white;
    text-align: center;
}

#ptc-calculator-submit-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

#partial-tax-conversion-calculator {
    display: flex;
    flex-direction: column;
    min-height: 50%;
}


#ptc-calculator-title {
    font-size: large;
    font-weight: bolder;
    text-align: center;
}

#partial-tax-conversion-calculator .flex-group {
    display: flex;
    flex-direction: column;
}

    #partial-tax-conversion-calculator .flex-group > * {
        flex: 1;
    }

    #partial-tax-conversion-calculator .flex-group > label {
        align-content: center;
    }

#ptc-calculator-input {
    max-width: 800px;
    width: 100%;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
}

#ptc-calculator-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

#ptc-calculator-output {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

#ptc-output-input > div,
#ptc-output-input-mobile {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-column-gap: 1rem;
    grid-row-gap: 0.15rem;
}

#ptc-output-input {
    display: none;
}

    #ptc-output-input > div > div:nth-child(even),
    #ptc-output-input-mobile > div:nth-child(even) {
        text-align: right;
    }

.ptc-output-tables {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ptc-output-table {
    border: 1px solid black;
}

    .ptc-output-table > div {
        text-align: right;
        padding-inline: 0.5rem;
    }

.table-header {
    border-bottom: 1px solid black;
    /*text-align: center!important;*/
}

.table-title {
    grid-column: 1 / -1;
    text-align: center!important;
    font-weight: bold;
}

#ptc-output-table-inherited-ira,
#ptc-output-table-tax-inherited-ira {
    display: grid;
    grid-template-columns: repeat(2, min-content) repeat(6, auto)
}

#ptc-output-table-non-qualified-annuity,
#ptc-output-table-tax-non-qualified-annuity {
    display: grid;
    grid-template-columns: repeat(2, min-content) repeat(4, auto);
}

#ptc-output-table-total,
#ptc-output-table-tax-total {
    display: grid;
    grid-template-columns: repeat(2, min-content) repeat(4, auto);
}

#ptc-output-table-year-age,
#ptc-output-table-tax-year-age {
    display: none;
}

@media (min-width: 576px) {
    #partial-tax-conversion-calculator .flex-group {
        flex-direction: row;
    }

    #ptc-calculator-submit-container {
        justify-content: end;
    }
}

@media (min-width: 768px) {
    #ptc-output-input-mobile {
        display: none;
    }

    #ptc-output-input {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        padding-inline: 1rem;
        gap: 1rem;
    }
}

@media (min-width: 1471px) {
    .ptc-output-tables {
        display: grid;
        grid-template-columns: min-content repeat(3, auto);
    }

    #ptc-output-table-year-age,
    #ptc-output-table-tax-year-age {
        display: grid;
        grid-template-columns: min-content min-content;
    }

    .year-age {
        display: none;
    }

    #ptc-output-table-inherited-ira,
    #ptc-output-table-tax-inherited-ira {
        display: grid;
        grid-template-columns: repeat(6, auto);
    }

    #ptc-output-table-non-qualified-annuity,
    #ptc-output-table-tax-non-qualified-annuity {
        display: grid;
        grid-template-columns: repeat(4, auto);
    }

    #ptc-output-table-total,
    #ptc-output-table-tax-total {
        display: grid;
        grid-template-columns: repeat(4, auto);
    }
}
