/* VKM Finans Widgets: doviz cevirici (dark kart)
   Zemin vkmfinans'in koyu lacivertidir (#011d32, eski cevirici ile ayni ton);
   vurgu rengi temanin accent'inden gelir. */

.vkmfw-converter {
    --vkmfw-bg: #011d32;
    --vkmfw-field-bg: #0a2f4d;
    --vkmfw-border: #16405f;
    --vkmfw-text: #ffffff;
    --vkmfw-secondary: #c9d6e2;
    --vkmfw-muted: #8aa2b5;
    --vkmfw-accent: var(--cs-color-accent, #206BEA);

    background: var(--vkmfw-bg);
    border-radius: 10px;
    padding: 20px 18px 12px 18px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.vkmfw-converter__row {
    display: flex;
    align-items: stretch;
    gap: 12px;
}

.vkmfw-converter__field {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    border-bottom: 1.5px solid var(--vkmfw-border);
    cursor: text;
}

.vkmfw-converter__field:focus-within {
    border-bottom-color: var(--vkmfw-accent);
}

.vkmfw-converter__symbol {
    flex: 0 0 auto;
    min-width: 1.1em;
    text-align: center;
    color: var(--vkmfw-muted);
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1;
}

/* Para birimine uygun simge renkleri (koyu lacivert zeminde okunakli tonlar). */
.vkmfw-converter__symbol[data-code="TRY"] { color: #f87171; }
.vkmfw-converter__symbol[data-code="USD"] { color: #4ade80; }
.vkmfw-converter__symbol[data-code="EUR"] { color: #60a5fa; }
.vkmfw-converter__symbol[data-code="GBP"] { color: #c084fc; }
.vkmfw-converter__symbol[data-code="CHF"] { color: #fb923c; }
.vkmfw-converter__symbol[data-code="GAU"] { color: #fbbf24; }

.vkmfw-converter__field .vkmfw-converter__input {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    background: transparent !important;
    color: var(--vkmfw-text) !important;
    border: none !important;
    border-radius: 0;
    padding: 8px 2px !important;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    outline: none;
    box-shadow: none;
}

.vkmfw-converter__select-wrap {
    position: relative;
    flex: 0 0 44%;
    display: flex;
}

.vkmfw-converter__select-wrap::after {
    content: "";
    position: absolute;
    right: 10px;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-top: -6px;
    border-right: 1.5px solid var(--vkmfw-muted);
    border-bottom: 1.5px solid var(--vkmfw-muted);
    transform: rotate(45deg);
    pointer-events: none;
}

.vkmfw-converter__row .vkmfw-converter__select {
    width: 100% !important;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: var(--vkmfw-field-bg) !important;
    color: var(--vkmfw-text) !important;
    border: 1px solid transparent !important;
    border-radius: 7px;
    padding: 8px 26px 8px 10px !important;
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
    outline: none;
}

.vkmfw-converter__row .vkmfw-converter__select:focus {
    border-color: var(--vkmfw-accent) !important;
}

/* Acilan listenin kendisi de koyu kalsin (destekleyen tarayicilarda). */
.vkmfw-converter__row .vkmfw-converter__select option {
    background: var(--vkmfw-field-bg);
    color: var(--vkmfw-text);
}

.vkmfw-converter__foot {
    display: flex;
    justify-content: center;
    margin-top: 2px;
}

.vkmfw-converter__foot .vkmfw-converter__powered {
    font-size: 0.62rem;
    letter-spacing: 0.02em;
    color: var(--vkmfw-muted) !important;
    text-decoration: none !important;
    background: none !important;
    border: none !important;
}

.vkmfw-converter__foot .vkmfw-converter__powered b {
    font-weight: 700;
    color: var(--vkmfw-secondary);
}

.vkmfw-converter__foot .vkmfw-converter__powered:hover,
.vkmfw-converter__foot .vkmfw-converter__powered:hover b {
    color: var(--vkmfw-text);
}