

.psa-calculator {
    max-width: 700px;
    padding: 20px;
    border: 1px solid var(--base-light, #e5e5e5);
    border-radius: 10px;
    background: var(--white, #ffffff);
    margin-bottom: 30px;
}

.psa-calculator * {
    box-sizing: border-box;
}

.psa-calculator .psa-calc-title {
    margin-top: 0;
    margin-bottom: 10px;
}

.psa-calculator .psa-calc-description {
    font-size: 1.2rem;
    margin-bottom: 20px;
    color: #555;
}

.psa-calculator .psa-calc-field {
    margin-bottom: 15px;
}

.psa-calculator label {
    font-size: 0.9rem;
    margin-bottom: 5px;
    display: block;
    font-weight: 600;
}

.psa-calculator input,
.psa-calculator select,
.psa-calculator textarea {
    width: 100%;
    padding: 8px;
    margin-bottom: 0;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.psa-calculator input[readonly],
.psa-calculator textarea[readonly] {
    background: #f7f7f7;
    font-weight: 600;
}

.psa-calculator .psa-calc-help {
    display: block;
    font-size: 1rem;
    color: #666;
    margin-top: 4px;
}

.psa-calculator .psa-calc-row {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.psa-calculator .psa-calc-row .psa-calc-field {
    flex: 1 1 220px;
}

.psa-calculator .psa-calc-input-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.psa-calculator .psa-calc-input-group input {
    flex: 1;
}

.psa-calculator .psa-calc-unit {
    font-size: 0.9rem;
    font-weight: 600;
    color: #444;
    white-space: nowrap;
}

.psa-calculator .buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 15px 0;
}

.psa-calculator button {
    margin-bottom: 0;
}

.psa-calculator .psa-calc-result-box {
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #f7f7f7;
    margin-top: 15px;
}

.psa-calculator .psa-calc-result-label {
    font-size: 1rem;
    font-weight: 600;
    color: #555;
    margin-bottom: 5px;
}

.psa-calculator .psa-calc-result-value {
    font-size: 1.5rem;
    font-weight: 700;
}

.psa-calculator .psa-calc-note,
.psa-calculator .psa-calc-formula,
.psa-calculator .psa-calc-assumption {
    font-size: 1.2rem;
    color: #555;
    margin-top: 10px;
}

.psa-calculator .psa-calc-formula {
    padding: 10px;
    border-left: 4px solid #ccc;
    background: #fafafa;
}

.psa-calculator .psa-calc-warning {
    padding: 10px;
    border-radius: 5px;
    background: #fff4e5;
    color: #6b3d00;
    font-size: 0.9rem;
    margin-top: 10px;
}

.psa-calculator .psa-calc-error {
    padding: 10px;
    border-radius: 5px;
    background: #fdecec;
    color: #7a1f1f;
    font-size: 0.9rem;
    margin-top: 10px;
}

.psa-calculator .psa-calc-success {
    padding: 10px;
    border-radius: 5px;
    background: #edf7ed;
    color: #1f5f2e;
    font-size: 0.9rem;
    margin-top: 10px;
}

.psa-calculator .psa-calc-hidden {
    display: none;
}

.psa-calculator table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
}

.psa-calculator th,
.psa-calculator td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}

.psa-calculator th {
    background: #f7f7f7;
    font-weight: 700;
}

@media (max-width: 600px) {
    .psa-calculator {
        padding: 15px;
    }

    .psa-calculator .buttons {
        flex-direction: column;
    }

    .psa-calculator .buttons button {
        width: 100%;
    }
}


html.dark .psa-calculator,
[data-color-mode="dark"] .psa-calculator {
    background: var(--fcom-secondary-bg, #1f1f1f);
    border-color: #444;
}

html.dark .psa-calculator input,
html.dark .psa-calculator select,
html.dark .psa-calculator textarea,
[data-color-mode="dark"] .psa-calculator input,
[data-color-mode="dark"] .psa-calculator select,
[data-color-mode="dark"] .psa-calculator textarea {
    background: #2a2a2a;
    color: #ffffff;
    border-color: #555;
}

html.dark .psa-calculator input[readonly],
html.dark .psa-calculator textarea[readonly],
[data-color-mode="dark"] .psa-calculator input[readonly],
[data-color-mode="dark"] .psa-calculator textarea[readonly] {
    background: #333333;
}

html.dark .psa-calculator .psa-calc-result-box,
[data-color-mode="dark"] .psa-calculator .psa-calc-result-box {
    background: #2a2a2a;
    border-color: #555;
}

html.dark .psa-calculator .psa-calc-description,
html.dark .psa-calculator .psa-calc-help,
html.dark .psa-calculator .psa-calc-note,
html.dark .psa-calculator .psa-calc-formula,
html.dark .psa-calculator .psa-calc-assumption,
[data-color-mode="dark"] .psa-calculator .psa-calc-description,
[data-color-mode="dark"] .psa-calculator .psa-calc-help,
[data-color-mode="dark"] .psa-calculator .psa-calc-note,
[data-color-mode="dark"] .psa-calculator .psa-calc-formula,
[data-color-mode="dark"] .psa-calculator .psa-calc-assumption {
    color: #cccccc;
}

html.dark .psa-calculator .psa-calc-formula,
[data-color-mode="dark"] .psa-calculator .psa-calc-formula {
    background: #252525;
    border-left-color: #666;
}