/* Model-kostenbeleid bewerk-dialog (#1565).
   These rules are global on purpose: the dialog body is projected through MudDialog's provider
   portal, so component-scoped CSS does not reach it (same constraint as ck-dialog.* in cockpit.css). */

.mpd-label { font-size:12px; color:var(--ck-text, #605d57); font-weight:600; margin-bottom:7px; }

/* kostendrager — segmented control */
.mpd-seg {
    display:flex; gap:4px; max-width:300px;
    background:color-mix(in srgb, var(--ck-border, #efeee8) 55%, transparent);
    border-radius:10px; padding:3px;
}
.mpd-seg-opt {
    flex:1; text-align:center; font-size:13px; font-weight:500; cursor:pointer;
    color:var(--ck-text-muted, #83807a); background:transparent; border:none; border-radius:8px; padding:7px 10px;
    font-family:inherit; transition:background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.mpd-seg-opt.is-active {
    color:var(--ck-accent-ink, #17605b); background:var(--ck-surface, #fff); font-weight:600;
    box-shadow:0 1px 2px rgba(40, 38, 34, .08);
}

.mpd-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:560px) { .mpd-grid2 { grid-template-columns:1fr; } }

.mpd-hint { font-size:11.5px; color:var(--ck-text-muted, #918e87); line-height:1.4; margin-top:-6px; }

/* BYOK-fee block */
.mpd-byok {
    padding:15px 16px; border-radius:12px;
    background:var(--ck-surface, #fff); border:1.5px solid var(--ck-accent, #1c6b66);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--ck-accent, #1c6b66) 13%, transparent);
}
.mpd-byok-head { display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:600; color:var(--ck-text, #36342f); margin-bottom:11px; }
.mpd-byok-tag {
    font-size:11px; font-weight:600; color:var(--ck-accent-ink, #17605b);
    background:var(--ck-accent-tint, #dde8e6); border-radius:999px; padding:2px 8px;
}

/* derived price preview */
.mpd-derived {
    display:flex; align-items:center; gap:11px; padding:12px 15px; border-radius:11px;
    background:var(--ck-accent-tint, #dde8e6); border:1px solid var(--ck-accent-soft, #9ec5c1);
}
.mpd-derived .mud-icon-root { color:var(--ck-accent-ink, #17605b); flex:none; }
.mpd-derived-text { flex:1; font-size:12.5px; color:var(--ck-accent-ink, #17605b); line-height:1.4; }
.mpd-derived-val { font-size:16px; font-weight:600; color:var(--ck-accent-ink, #17605b); font-variant-numeric:tabular-nums; white-space:nowrap; }
.mpd-derived-unit { font-size:11px; font-weight:500; color:var(--ck-accent, #1c6b66); }

/* honest note */
.mpd-note {
    display:flex; align-items:flex-start; gap:9px; padding:11px 13px; border-radius:10px;
    background:color-mix(in srgb, var(--ck-text-muted, #a8a49b) 12%, transparent);
    border:1px solid var(--ck-border, #e0ddd4); font-size:12px; color:var(--ck-text, #605d57); line-height:1.5;
}
.mpd-note .mud-icon-root { font-size:15px; color:var(--ck-text-muted, #7d7a72); flex:none; margin-top:1px; }