﻿/* Pritaikymas siauriems ekranams.
   Viskas uzdaryta i @media, todel darbalaukio vaizdas nepasikeicia nė per pikseli.

   Ka atsveria: Forms.css nustato input { width: 20em }, formu sarasai plaukia
   (float: left) ir turi margin-right: 3em, o Site.css duoda article { width: 67em }.
   Telefone visa tai isvazioja uz ekrano, todel cia tie plociai atsaukiami. */

@media (max-width: 900px) {

    /* --- niekas negali buti platesnis uz ekrana --- */
    html, body {
        max-width: 100%;
        overflow-x: hidden;
    }

    body {
        font-size: 1em;
        -webkit-text-size-adjust: 100%;
    }

    #container {
        min-height: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    /* --- isdestymas --- */
    aside {
        float: none;
        width: auto;
        max-width: 100%;
        margin: 0;
        padding: 8px 12px;
        box-sizing: border-box;
    }

    aside ul li {
        padding: 10px 4px;
        border-bottom: 1px solid #C6CDCE;
    }

    aside ul li:last-child { border-bottom: none; }

    article, article.full {
        float: none;
        width: auto;
        max-width: 100%;
        margin-left: 0;
        padding: 0 12px 3em 12px;
        box-sizing: border-box;
    }

    /* --- prisijungimo forma --- */
    #loginform {
        width: auto;
        max-width: 100%;
        margin: 0;
        padding: 0 14px;
        box-sizing: border-box;
    }

    #loginform h2 {
        padding-top: 0.5em;
        font-size: 1.4em;
    }

    #login {
        float: none;
        padding: 6px 12px;
    }

    /* --- formos: atsaukiam fiksuotus plocius ir plaukimus --- */
    form ul, ul.form, ul.rightaligned, ul.buttons, .toolbar, .linkbutton,
    .menubutton, .splitbutton {
        float: none;
        width: auto;
        max-width: 100%;
        box-sizing: border-box;
    }

    form ul li, ul.form li, ul.rightaligned li {
        margin-right: 0;
        margin-left: 0;
        clear: both;
        max-width: 100%;
    }

    /* laukai per visa plotį vietoj 20em / 14em / 42.9em */
    input[type="text"], input[type="password"], input[type="email"],
    input[type="number"], input[type="date"], input[type="file"],
    select, textarea,
    form ul span.display, ul.form span.display, ul.rightaligned span.display,
    ul.rightaligned input, ul.rightaligned select, ul.rightaligned textarea,
    .compact input[type="text"], .compact select, .compact span.display,
    ul input.double, ul.form span.double, ul.form span.short,
    .largetextarea {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 16px;
        box-sizing: border-box;
        float: none;
        margin-left: 0;
    }

    /* siauri skaiciu laukeliai lieka siauri, kitaip atrodo absurdiškai */
    input[type="text"].n2, .compact input[type="text"].smallerInput,
    h4 input.datepicker {
        width: 8em !important;
    }

    input[type="checkbox"], input[type="radio"] {
        width: auto !important;
        min-height: 0;
    }

    /* etiketes virs lauku, ne salia */
    ul.rightaligned label {
        float: none;
        width: auto;
        display: block;
        clear: both;
    }

    ul.rightaligned .nolabel,
    ul.rightaligned .field-validation-error {
        margin-left: 0;
        width: auto;
    }

    .menubutton ul { width: auto; max-width: 100%; }

    input[type="submit"], input[type="button"], button {
        min-height: 40px;
        padding: 8px 16px;
        font-size: 15px;
        width: auto;
    }

    .toolbar input, .toolbar .buttons, .toolbar ul li {
        float: none;
        width: auto;
        display: inline-block;
        margin-right: 6px;
    }

    fieldset { max-width: 100%; box-sizing: border-box; }

    /* --- virsutinis meniu: liečiamas sarasas --- */
    .navmenu { height: auto; white-space: normal; overflow: visible; }
    div.navbar { white-space: normal; }

    .navmenu > li { float: none; display: block; width: 100%; }

    .navmenu > li > a {
        display: block;
        padding: 12px 14px;
        border-bottom: 1px solid #DDE2E3;
    }

    /* submeniu darbalaukyje atsiveria uzvedus pele - telefone tiesiog rodomi */
    .navmenu ul {
        position: static !important;
        display: block !important;
        width: auto !important;
        border: none !important;
        box-shadow: none !important;
    }

    .navmenu ul li a { display: block; padding: 10px 14px 10px 28px; font-size: .95em; }
    .navmenu .has-submenu { position: static; float: right; }

    /* --- lenteles slenka horizontaliai vietoj isvaziavimo --- */
    table.list, table.details, table.grid {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }

    /* perjungiklis makete turi inline stiliu, todel cia butinas !important */
    #langswitch {
        position: static !important;
        top: auto !important;
        right: auto !important;
        display: flex !important;
        width: -moz-max-content;
        width: max-content;
        margin: 8px 12px 4px auto;
    }

    img { max-width: 100%; height: auto; }
}

@media (max-width: 600px) {

    article, article.full { padding: 0 8px 3em 8px; }
    #loginform { padding: 0 10px; }
    #loginform h2 { padding-top: 0.3em; font-size: 1.3em; }
    aside { padding: 6px 8px; }

    h2 { font-size: 1.25em; word-wrap: break-word; }

    ul.links li { display: block; padding: 6px 0; }

    #langswitch { margin-right: 8px; }
}
