/* PHONE -----------------------------------------------------------------------------------*/

@media all and (max-width: 950px) {
    /*  Layout ------------------------------------*/
    html,
    body,
    footer {
        background: #fff;
    }
    #yii-debug-toolbar { display: none !important; }
    footer { text-align: center }
    footer a:first-child span.tn-space { display: none }
    #search-box-mobile  {
        position: absolute;
        top:  0;
        left:  20px;
    }
    #search-box-mobile input { 
        width:  300px; 
        transition: all 0.2s ease 0s;
        outline: 0;
        color: #333;
        background: #f0f2f5;
        border-radius: 25px ;
        padding-left:  45px;
        border: solid 1px #C6CDD8;
        margin-top: 10px;
        font-size: 15.5px;
    }
    #search-box-mobile .fa {
        font-size: 18px;
        position: absolute;
        top: 22px;
        left: 12px;
        color: #999;
    }
    .navbar.fixed-top li.profile {
        position: absolute;
        top: 15px;
        right: 30px;
    }
    .navbar.fixed-top li.profile i.fa-user-circle-o { font-size: 30px }
    .navbar.fixed-bottom {
        padding: 0.5rem 0;
        z-index: 1030;
        position: fixed;
        bottom: 0;
        border-top: solid 1px #ddd;
        width: 100%;
        background: #f5f5f5;
        margin-bottom: 0;
    }
    .navbar.fixed-bottom ul {
        margin-left: 5px;
    }
    .navbar.fixed-bottom ul:first-child > li > a.dropdown-item {
        padding: 20px;
        margin: 0 5px 10px 5px;
    }
    .navbar.fixed-bottom ul i { font-size: 23px; }
    .navbar.fixed-bottom .nav-link i { font-size: 26px; }
    .navbar.fixed-bottom ul > li > .nav-link { 
        padding: 13px;
        color: #47759e;
        margin-top: 5px;
    }
    .navbar.fixed-bottom ul > li span { display: none; }
    .navbar.fixed-bottom .dropdown-menu { margin-bottom: -5px }

    .badge-area { 
        bottom: 50px;
        left: 5px;
    }

    .main-content.header { padding: 0; }

    .header-content-container,
    .main-content-container { margin: 0 25px;  }
    .header-right .btn-link { padding-right: 0; }
    .page.card { 
        border: 0;
        padding: 30px 15px;
        margin: 0;
    }
    .page.card,
    .card.section,
    .panel {
        border: 0;
        padding: 0;
        box-shadow: none;
    }
    .page-title { font-size: 30px; }
    .card-title { font-size: 1.1em; }
    .table thead > tr > th:first-child,
    .table tbody > tr > td:first-child { padding-left: 0; }
    .table thead > tr > th:last-child,
    .table tbody > tr > td:last-child { padding-right: 0; }

    /*  Shared Components  ------------------------------------*/
    .tooltip { display: none !important; }
    .trunc {
        white-space: normal; /* Reset to default wrapping */
        overflow: visible;   /* Show overflow */
        text-overflow: clip; /* Default text overflow behavior */
    }
    .grid-view th,
    #main-links li,
    .left-menu { display: none; }
    .site-search-menu {
        position: relative;
        left: 0 !important;
        width: 95% !important;
        margin: 0 10px;
    }
    .page.card, .filter-button-container {
        width: 100%;
    }
    .col-l { padding-right: 0; }
    .col-r { padding-left: 0; }
    .form-group button { margin-top: 10px; }
    .panel-header i,
    .no-mobile { display: none !important; }
    #login .inner-container .checkbox { margin-left: 30px !important; }
    .col-r { padding-left: 0 }
    .summary .label { padding-left: 2px }
    .filter-form {
      position: fixed;
      top: 50px;
      left: 0;
      margin: 10px;
      overflow-y: auto;
      width: auto;
    }

    /*  Properties  ------------------------------------*/
    #building-list .card.section {
        border: 0;
        padding: 0;
    }
    #building-list .building-row { 
        padding: 15px 5px;
        border-bottom: solid 1px #eee;
    }
    #building-list .building-row .btn-inside { 
        padding-right: 0;
        text-align: right;
    }
    #building-list .detail { width: 150px; }
    #building-list .balance-container { 
        width: 100px; 
        text-align: right;
    }

    /*  Accounts  ------------------------------------*/
    #account-view .resident-item {
        padding: 7px 12px;
        font-size: .95;
        min-width: 150px;
    }


    /*  Payments  ------------------------------------*/

    /*  Support  ------------------------------------*/
    #support-view #detail-container {
        flex-direction: column;
        min-height: 600px; 
    }
}

@media all and (min-width: 950px) {
    .only-mobile { display: none !important; }
    .row { position: relative; }
    nav { padding: 15px; }
    #account-list thead > tr > td:first-child { display: none; }
    .col-r { padding-right: 0; }
    #dev-env {
        padding-top: 5px;
        opacity: .5;
    }
    #support-view .post .update-container { min-width: 275px; }

    #support-view .panel-updates {
        margin-top: -40px;
    }
}



/* TABLET -----------------------------------------------------------------------------------*/


@media (display-mode: standalone) {
    .no-sa { display: none; }

    .main-content > .main-tn,
    .main-content > .main-sm,
    .main-content > .main-md,
    .main-content > .main-lg { 
        margin: auto;
        max-width: 100%; 
    }
    body, body :not(i):not(.page-title):not(.main-links > li > a):not(h4):not(.sub):not(.badge-1),
    #support-view .attrib-row {
        font-size: calc(105%);
    }
    .main-link-item { font-size: 16px !important; }
    .small, small { font-size: .95em !important; }
}