/*
 * Device-local skaliranje legacy Bootstrap 3 interfejsa.
 *
 * Moderni moduli mogu da promene samo root font-size jer su rem-bazirani. Bootstrap 3
 * koristi fiksne px mere, zato legacy adapter koristi CSS zoom koji menja i tekst i kontrole
 * i raspolozivu sirinu layout-a. Fallback bez zoom podrske uvecava bar osnovni tekst.
 */

html[data-ds-ui-scale] {
    --ds-legacy-ui-scale: 1;
}

/* Telefon (<768px): zadrzava potvrđenu postojecu skalu. */
html[data-ds-ui-scale="compact"] { --ds-legacy-ui-scale: 0.95; }
html[data-ds-ui-scale="normal"]  { --ds-legacy-ui-scale: 1; }
html[data-ds-ui-scale="large"]   { --ds-legacy-ui-scale: 1.15; }
html[data-ds-ui-scale="xlarge"]  { --ds-legacy-ui-scale: 1.35; }
html[data-ds-ui-scale="huge"]    { --ds-legacy-ui-scale: 1.6; }
html[data-ds-ui-scale="xhuge"]   { --ds-legacy-ui-scale: 1.9; }
html[data-ds-ui-scale="xxhuge"]  { --ds-legacy-ui-scale: 2.25; }

/* Tablet/desktop (>=768px): Normalno je 1x, tj. nekadasnja desktop velicina "Sitno". */
@media (min-width: 48em) {
    html[data-ds-ui-scale="compact"] { --ds-legacy-ui-scale: 0.75; }
    html[data-ds-ui-scale="normal"]  { --ds-legacy-ui-scale: 0.85; }
    html[data-ds-ui-scale="large"]   { --ds-legacy-ui-scale: 0.95; }
    html[data-ds-ui-scale="xlarge"]  { --ds-legacy-ui-scale: 1; }
    html[data-ds-ui-scale="huge"]    { --ds-legacy-ui-scale: 1.15; }
    html[data-ds-ui-scale="xhuge"]   { --ds-legacy-ui-scale: 1.35; }
    html[data-ds-ui-scale="xxhuge"]  { --ds-legacy-ui-scale: 1.6; }
}

html[data-ds-ui-scale] body {
    font-size: calc(14px * var(--ds-legacy-ui-scale));
}

@supports (zoom: 1) {
    html[data-ds-ui-scale] body {
        font-size: 14px;
        zoom: var(--ds-legacy-ui-scale);
    }

    /* Bootstrap 3 container-i imaju px sirine prema stvarnom viewport-u. Posle zoom-a bi
       izlazili iz efektivne sirine, pa svaki prikaz razlicit od 1x koristi fluidni container. */
    @media (max-width: 47.999em) {
        html[data-ds-ui-scale]:not([data-ds-ui-scale="normal"]) .container {
            max-width: none;
            width: auto;
        }
    }

    @media (min-width: 48em) {
        html[data-ds-ui-scale]:not([data-ds-ui-scale="xlarge"]) .container {
            max-width: none;
            width: auto;
        }
    }
}

.dropdown-menu a[data-ds-ui-scale-option].active::after {
    content: "\2713";
    float: right;
    margin-left: 10px;
}

/* Kada scale spusti efektivnu sirinu ispod 768px, Bootstrap 3 px media query i dalje vidi
   sirok prozor. Vracamo mobilni navbar da krupan prikaz ne preklopi navigaciju. */
html[data-ds-legacy-effective-tier="1"] .navbar-header {
    float: none;
}

html[data-ds-legacy-effective-tier="1"] .navbar-toggle {
    display: block;
}

html[data-ds-legacy-effective-tier="1"] .navbar-collapse {
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    margin-left: -15px;
    margin-right: -15px;
    overflow-x: visible;
    padding-left: 15px;
    padding-right: 15px;
    width: auto;
}

html[data-ds-legacy-effective-tier="1"] .navbar-collapse.collapse {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
}

html[data-ds-legacy-effective-tier="1"] .navbar-collapse.collapse.in {
    display: block !important;
    height: auto !important;
    overflow-y: auto !important;
}

html[data-ds-legacy-effective-tier="1"] .navbar-nav,
html[data-ds-legacy-effective-tier="1"] .navbar-right {
    float: none !important;
    margin: 7.5px -15px;
}

html[data-ds-legacy-effective-tier="1"] .navbar-nav > li {
    float: none;
}

html[data-ds-legacy-effective-tier="1"] .navbar-nav > li > a {
    line-height: 20px;
    padding-bottom: 10px;
    padding-top: 10px;
}

html[data-ds-legacy-effective-tier="1"] .navbar-nav .open .dropdown-menu {
    background-color: transparent;
    border: 0;
    box-shadow: none;
    float: none;
    margin-top: 0;
    position: static;
    width: auto;
}

html[data-ds-legacy-effective-tier="1"] .navbar-nav .open .dropdown-menu > li > a,
html[data-ds-legacy-effective-tier="1"] .navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
}

html[data-ds-legacy-effective-tier="1"] .hidden-xs {
    display: none !important;
}

html[data-ds-legacy-effective-tier="1"] .visible-xs,
html[data-ds-legacy-effective-tier="1"] .visible-xs-block {
    display: block !important;
}

html[data-ds-legacy-effective-tier="1"] .visible-xs-inline {
    display: inline !important;
}

html[data-ds-legacy-effective-tier="1"] .visible-xs-inline-block {
    display: inline-block !important;
}

/* Bootstrap grid breakpoints su u px i zato ne prate CSS zoom. Vracamo kolone na poslednji
   raspolozivi nizi tier; klasa tog nizeg tier-a, kada postoji, ponovo dobija svoju sirinu. */
html[data-ds-legacy-effective-tier="1"] [class*="col-sm-"],
html[data-ds-legacy-effective-tier="1"] [class*="col-md-"],
html[data-ds-legacy-effective-tier="1"] [class*="col-lg-"] {
    float: none !important;
    left: auto !important;
    margin-left: 0 !important;
    right: auto !important;
    width: 100% !important;
}

html[data-ds-legacy-effective-tier="1"] .col-xs-1,
html[data-ds-legacy-effective-tier="1"] .col-xs-2,
html[data-ds-legacy-effective-tier="1"] .col-xs-3,
html[data-ds-legacy-effective-tier="1"] .col-xs-4,
html[data-ds-legacy-effective-tier="1"] .col-xs-5,
html[data-ds-legacy-effective-tier="1"] .col-xs-6,
html[data-ds-legacy-effective-tier="1"] .col-xs-7,
html[data-ds-legacy-effective-tier="1"] .col-xs-8,
html[data-ds-legacy-effective-tier="1"] .col-xs-9,
html[data-ds-legacy-effective-tier="1"] .col-xs-10,
html[data-ds-legacy-effective-tier="1"] .col-xs-11,
html[data-ds-legacy-effective-tier="1"] .col-xs-12 {
    float: left !important;
}

html[data-ds-legacy-effective-tier="1"] .col-xs-12 { width: 100% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-11 { width: 91.66666667% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-10 { width: 83.33333333% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-9  { width: 75% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-8  { width: 66.66666667% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-7  { width: 58.33333333% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-6  { width: 50% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-5  { width: 41.66666667% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-4  { width: 33.33333333% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-3  { width: 25% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-2  { width: 16.66666667% !important; }
html[data-ds-legacy-effective-tier="1"] .col-xs-1  { width: 8.33333333% !important; }

html[data-ds-legacy-effective-tier="2"] [class*="col-md-"],
html[data-ds-legacy-effective-tier="2"] [class*="col-lg-"] {
    float: none !important;
    left: auto !important;
    margin-left: 0 !important;
    right: auto !important;
    width: 100% !important;
}

html[data-ds-legacy-effective-tier="2"] .col-sm-1,
html[data-ds-legacy-effective-tier="2"] .col-sm-2,
html[data-ds-legacy-effective-tier="2"] .col-sm-3,
html[data-ds-legacy-effective-tier="2"] .col-sm-4,
html[data-ds-legacy-effective-tier="2"] .col-sm-5,
html[data-ds-legacy-effective-tier="2"] .col-sm-6,
html[data-ds-legacy-effective-tier="2"] .col-sm-7,
html[data-ds-legacy-effective-tier="2"] .col-sm-8,
html[data-ds-legacy-effective-tier="2"] .col-sm-9,
html[data-ds-legacy-effective-tier="2"] .col-sm-10,
html[data-ds-legacy-effective-tier="2"] .col-sm-11,
html[data-ds-legacy-effective-tier="2"] .col-sm-12 {
    float: left !important;
}

html[data-ds-legacy-effective-tier="2"] .col-sm-12 { width: 100% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-11 { width: 91.66666667% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-10 { width: 83.33333333% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-9  { width: 75% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-8  { width: 66.66666667% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-7  { width: 58.33333333% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-6  { width: 50% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-5  { width: 41.66666667% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-4  { width: 33.33333333% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-3  { width: 25% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-2  { width: 16.66666667% !important; }
html[data-ds-legacy-effective-tier="2"] .col-sm-1  { width: 8.33333333% !important; }

html[data-ds-legacy-effective-tier="3"] [class*="col-lg-"] {
    float: none !important;
    left: auto !important;
    margin-left: 0 !important;
    right: auto !important;
    width: 100% !important;
}

html[data-ds-legacy-effective-tier="3"] .col-md-1,
html[data-ds-legacy-effective-tier="3"] .col-md-2,
html[data-ds-legacy-effective-tier="3"] .col-md-3,
html[data-ds-legacy-effective-tier="3"] .col-md-4,
html[data-ds-legacy-effective-tier="3"] .col-md-5,
html[data-ds-legacy-effective-tier="3"] .col-md-6,
html[data-ds-legacy-effective-tier="3"] .col-md-7,
html[data-ds-legacy-effective-tier="3"] .col-md-8,
html[data-ds-legacy-effective-tier="3"] .col-md-9,
html[data-ds-legacy-effective-tier="3"] .col-md-10,
html[data-ds-legacy-effective-tier="3"] .col-md-11,
html[data-ds-legacy-effective-tier="3"] .col-md-12 {
    float: left !important;
}

html[data-ds-legacy-effective-tier="3"] .col-md-12 { width: 100% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-11 { width: 91.66666667% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-10 { width: 83.33333333% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-9  { width: 75% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-8  { width: 66.66666667% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-7  { width: 58.33333333% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-6  { width: 50% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-5  { width: 41.66666667% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-4  { width: 33.33333333% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-3  { width: 25% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-2  { width: 16.66666667% !important; }
html[data-ds-legacy-effective-tier="3"] .col-md-1  { width: 8.33333333% !important; }

/* Neprełamajuća legacy tabela može i dalje biti šira od ekstremno uvećanog telefonskog
   viewport-a. Skrol ostaje u sadržaju, umesto da proširi celu stranicu i navbar. */
html[data-ds-legacy-effective-tier="1"] .body-content {
    overflow-x: auto;
    overflow-wrap: anywhere;
}

html[data-ds-legacy-effective-tier="1"] .body-content .table {
    overflow-wrap: normal;
}

@media print {
    html[data-ds-ui-scale] body {
        font-size: 14px;
        zoom: 1;
    }
}
