/**
 * MPXXC Calculators 样式
 * 变量取自 Blogsy 主题 (themes/blogsy/assets/css/style.css :root),
 * 若主题变量存在则复用,否则回退到内置值,保证独立可用。
 */
.mpxxc-calc {
    /* 优先复用主题的 --pt-* 设计令牌 */
    --mc-accent: var(--pt-accent-color, #216be9);
    --mc-accent-alt: var(--pt-accent-color-alt, #fff);
    --mc-body: var(--pt-body-color, #282424);
    --mc-heading: var(--pt-headings-color, #29294b);
    --mc-card: var(--pt-card-bg, #fff);
    --mc-border: var(--pt-border-color, #e9e8ff);
    --mc-soft: var(--pt-shadow-soft, 0 4px 25px #25252e1f);
    --mc-radius: var(--pt-soft-radius, 12px);
    --mc-btn-radius: var(--pt-btn-radius, 50px);

    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    color: var(--mc-body);
    background: var(--mc-card);
    border: 1px solid var(--mc-border);
    border-radius: var(--mc-radius);
    box-shadow: var(--mc-soft);
    padding: 28px;
    margin: 0 auto 30px;
    max-width: var(--mc-max-width, 720px);
    font-size: var(--mc-font-size, 16px);
    line-height: 1.6;
    box-sizing: border-box;
}

.mpxxc-calc *,
.mpxxc-calc *::before,
.mpxxc-calc *::after {
    box-sizing: inherit;
}

.mpxxc-calc__head {
    margin-bottom: 20px;
}

.mpxxc-calc__title {
    font-family: "Instrument Sans", sans-serif;
    font-size: 1.5em;
    font-weight: 600;
    color: var(--mc-heading);
    margin: 0 0 6px;
}

.mpxxc-calc__desc {
    margin: 0;
    font-size: .95em;
    opacity: .8;
}

/* 模式切换 */
.mpxxc-calc__modes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 22px;
}

.mpxxc-calc__mode {
    font: inherit;
    font-size: .92em;
    font-weight: 600;
    color: var(--mc-heading);
    background: transparent;
    border: 1px solid var(--mc-border);
    border-radius: var(--mc-btn-radius);
    padding: 8px 18px;
    cursor: pointer;
    transition: background-color .25s, color .25s, border-color .25s;
}

.mpxxc-calc__mode:hover {
    border-color: var(--mc-accent);
    color: var(--mc-accent);
}

.mpxxc-calc__mode.is-active {
    color: var(--mc-accent-alt);
    background: var(--mc-accent);
    border-color: var(--mc-accent);
}

/* 主体两栏 */
.mpxxc-calc__body {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 26px;
    align-items: start;
}

.mpxxc-calc__fields,
.mpxxc-calc__results {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* 字段 */
.mpxxc-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.mpxxc-field[hidden] {
    display: none;
}

.mpxxc-field__label {
    font-size: .85em;
    font-weight: 600;
    color: var(--mc-heading);
}

.mpxxc-field__control {
    position: relative;
    display: flex;
    align-items: center;
}

/* 提高选择器优先级,避免被主题的 input 全局样式覆盖,并让输入框随基准字号缩放 */
.mpxxc-calc .mpxxc-field__input {
    width: 100%;
    font-family: inherit;
    font-weight: 400;
    font-size: 1em;
    line-height: 1.4;
    color: var(--mc-body);
    background: #fff;
    border: 1px solid var(--mc-border);
    border-radius: 10px;
    padding: .7em .9em;
    outline: none;
    box-shadow: none;
    transition: border-color .25s, box-shadow .25s;
}

.mpxxc-calc .mpxxc-field__input:focus {
    border-color: var(--mc-accent);
    box-shadow: 0 0 0 3px rgba(33, 107, 233, .12);
}

/* 隐藏 number 原生上下箭头,避免与右侧单位后缀重叠 */
.mpxxc-calc input.mpxxc-field__input::-webkit-outer-spin-button,
.mpxxc-calc input.mpxxc-field__input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.mpxxc-calc input.mpxxc-field__input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.mpxxc-field__suffix {
    position: absolute;
    right: .9em;
    font-size: .85em;
    font-weight: 600;
    color: var(--mc-body);
    opacity: .55;
    pointer-events: none;
}

/* 结果 */
.mpxxc-calc__results {
    background: var(--mc-card);
    border: 1px solid var(--mc-border);
    border-radius: 10px;
    padding: 18px;
}

.mpxxc-result[hidden] {
    display: none;
}

.mpxxc-result {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px dashed var(--mc-border);
}

.mpxxc-result:last-child {
    border-bottom: 0;
}

.mpxxc-result__label {
    font-size: .9em;
    opacity: .8;
}

.mpxxc-result__value {
    font-family: "Instrument Sans", sans-serif;
    font-weight: 700;
    font-size: 1.25em;
    color: var(--mc-accent);
    white-space: nowrap;
}

.mpxxc-result__suffix {
    font-size: .8em;
    font-weight: 600;
    margin-left: 3px;
    opacity: .7;
    color: var(--mc-body);
}

/* 下拉选择字段 */
.mpxxc-calc .mpxxc-field__select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23282424' d='M1.4 0 6 4.6 10.6 0 12 1.4l-6 6-6-6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .9em center;
    padding-right: 2.4em;
    cursor: pointer;
}

/* HTML 富结果(如摊销计划表) */
.mpxxc-calc .mpxxc-result[data-format="html"] {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
}

.mpxxc-result__html {
    width: 100%;
    overflow-x: auto;
    font-size: .9em;
}

.mpxxc-amort {
    width: 100%;
    border-collapse: collapse;
}

.mpxxc-amort th,
.mpxxc-amort td {
    padding: 6px 8px;
    text-align: right;
    white-space: nowrap;
    border-bottom: 1px solid var(--mc-border);
}

.mpxxc-amort th {
    color: var(--mc-heading);
    font-weight: 600;
    background: rgba(33, 107, 233, .05);
}

.mpxxc-amort th:first-child,
.mpxxc-amort td:first-child {
    text-align: left;
}

.mpxxc-amort tbody tr:last-child td {
    border-bottom: 0;
}

.mpxxc-table-note {
    margin-top: 8px;
    font-size: .82em;
    line-height: 1.5;
    opacity: .6;
}

/* 提示态 */
.mpxxc-calc--notice {
    color: #b3261e;
    border-color: #f2c4c0;
}

.mpxxc-calc--notice ul {
    margin: 0;
    padding-left: 18px;
}

/* 响应式 */
@media (max-width: 600px) {
    .mpxxc-calc {
        padding: 22px 18px;
    }
    .mpxxc-calc__body {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

/* ===== 区块编辑器编辑态(画布内联控件),仅后台出现,前台无此类节点 ===== */
.mpxxc-block-edit__controls {
    margin: 0 0 16px;
    padding: 12px 14px;
    border: 1px dashed #c3c4c7;
    border-radius: 8px;
    background: #f6f7f7;
}
.mpxxc-block-edit__controls .components-base-control {
    margin-bottom: 12px;
}
.mpxxc-block-edit__controls .components-base-control:last-child {
    margin-bottom: 0;
}