/* Isolated preview: no effect on the original currency page or other tools. */
.cekos-currency-preview-note {
    padding: .75em 1em;
    margin-block: 1em;
    border-inline-start: .25em solid #368400;
    background: #f1f7eb;
    color: #294020;
    font-size: .875rem;
    line-height: 1.5;
}
#main.cekos-currency-preview,
.cekos-currency-preview #mainform {
    width: 100%;
    min-width: 0;
}
.cekos-currency-preview .valuteblok {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: clamp(1rem, 3vw, 2.5rem);
    height: auto;
    min-width: 0;
}
.cekos-currency-preview .valutelevo {
    flex: 1 1 20rem;
    float: none;
    width: auto;
    min-width: 0;
    height: auto;
    margin: 0;
}
.cekos-currency-preview .valutedesno {
    flex: 2 1 28rem;
    width: auto;
    min-width: 0;
    height: auto;
    overflow: visible;
    container: cekos-rates / inline-size;
}
.cekos-currency-preview .frm_forms,
.cekos-currency-preview .frm_form_fields,
.cekos-currency-preview fieldset {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
.cekos-currency-preview .frm_forms select,
.cekos-currency-preview .frm_forms input:not([type="hidden"]) {
    max-width: 100%;
    box-sizing: border-box;
}
.cekos-currency-preview .wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: .75em;
}
.cekos-currency-preview .kursevi-title {
    overflow-wrap: anywhere;
}
.cekos-currency-preview .cekos-currency-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    margin-block: .5em 1em;
}
.cekos-currency-preview .cekos-currency-table-scroll:focus-visible {
    outline: 2px solid #368400;
    outline-offset: 2px;
}
.cekos-currency-preview .cekos-currency-table-scroll table {
    width: 100%;
    max-width: none;
    table-layout: auto;
    margin: 0;
}
.cekos-currency-preview .cekos-currency-table-scroll td {
    padding: .3em .45em;
    white-space: nowrap;
}
.cekos-currency-preview .cekos-currency-table-scroll td:nth-child(2) {
    white-space: normal;
    min-width: 9ch;
}
.cekos-currency-preview .cekos-currency-table-scroll .so-hide-small {
    display: table-cell !important;
}
.cekos-currency-preview .kursevi-lista {
    margin-inline: 0;
    padding-inline-start: 1.6em;
    overflow-wrap: anywhere;
}
/* Angular already emits stable cell classes, so no data or calculation changes are needed. */
@media screen {
    @container cekos-rates (max-width: 540px) {
        .cekos-currency-preview .cekos-currency-table-scroll {
            overflow: visible;
        }
        .cekos-currency-preview .cekos-currency-table-scroll table,
        .cekos-currency-preview .cekos-currency-table-scroll tbody {
            display: block;
            width: 100%;
            min-width: 0;
            border: 0;
        }
        .cekos-currency-preview .cekos-currency-table-scroll tbody {
            position: relative;
        }
        /* Keep column headings available to assistive technology. */
        .cekos-currency-preview .cekos-currency-table-scroll tr:first-child {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            clip-path: inset(50%);
            white-space: nowrap;
        }
        .cekos-currency-preview .cekos-currency-table-scroll tr:not(:first-child) {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: .3em .65em;
            width: 100%;
            min-width: 0;
            box-sizing: border-box;
            margin-block: 0 .65em;
            padding: .75em .85em;
            border: 1px solid #d9e1e5;
            border-radius: 6px;
            background: #fff;
            color: #33444e;
            font-size: 12px;
            line-height: 1.45;
        }
        .cekos-currency-preview .cekos-currency-table-scroll td {
            display: flex !important;
            align-items: baseline;
            justify-content: space-between;
            gap: .5em;
            grid-column: 1 / -1;
            min-width: 0;
            width: auto;
            padding: 0;
            border: 0;
            white-space: normal;
            overflow-wrap: anywhere;
            background: transparent;
        }
        .cekos-currency-preview .cekos-currency-table-scroll td.so-hide-small {
            display: flex !important;
        }
        .cekos-currency-preview .cekos-currency-table-scroll td::before {
            color: #62717b;
            font-weight: 400;
            text-align: left;
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputSifraAlfaTableCellClass {
            order: 0;
            grid-column: 1 / 2;
            color: #327400;
            font-weight: 700;
            font-size: 14px;
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputNazivZemljeTableCellClass {
            order: 1;
            grid-column: 2 / -1;
            font-weight: 600;
            text-align: left;
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputSifraNumTableCellClass {
            order: 2;
            grid-column: 1 / 3;
            justify-content: flex-start;
            font-size: 11px;
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputSifraNumTableCellClass::before {
            content: "Šifra:";
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputParitetTableCellClass {
            order: 3;
            grid-column: 3 / -1;
            justify-content: flex-end;
            font-size: 11px;
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputParitetTableCellClass::before {
            content: "Važi za:";
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputKupovniTableCellClass,
        .cekos-currency-preview .cekos-currency-table-scroll .OutputSrednjiTableCellClass,
        .cekos-currency-preview .cekos-currency-table-scroll .OutputProdajniTableCellClass {
            order: 4;
            padding-block-start: .3em;
            border-top: 1px solid #edf0f2;
            font-weight: 600;
            font-variant-numeric: tabular-nums;
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputKupovniTableCellClass::before {
            content: "Kupovni kurs:";
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputSrednjiTableCellClass::before {
            content: "Srednji kurs:";
        }
        .cekos-currency-preview .cekos-currency-table-scroll .OutputProdajniTableCellClass::before {
            content: "Prodajni kurs:";
        }
    }
}
@media print {
    .cekos-currency-preview-note { display: none; }
    .cekos-currency-preview .valuteblok { display: block; }
    .cekos-currency-preview .cekos-currency-table-scroll { overflow: visible; }
}