/*
This file is part of Flight Plotter.

    Flight Plotter is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Flight Plotter is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Flight Plotter.  If not, see <https://www.gnu.org/licenses/>.
*/

/* 
    Created on : Sep. 2020
    Author     : Artur Uzieblo
*/

[v-cloak] {
  display: none;
}

.el-row {
    padding-top: 2px;
}

.el-table {
    font-size: 10px;    
}

.el-table .danger-row {
    --el-table-tr-bg-color: lightcoral;
}

.el-table .warning-row {
    --el-table-tr-bg-color: oldlace;
}

.el-table .success-row {
    --el-table-tr-bg-color: #f0f9eb;
}

.el-drawer__body {
  overflow: auto;
}

.el-drawer__header {
  margin-bottom: 0px;
}

.el-drawer {
  --el-drawer-padding-primary: var(--el-dialog-padding-primary,8px);
  width: 22%;
}

/* Styles for tablets and larger screens (e.g., min-width: 768px) */
@media (min-width: 768px) {
    .el-drawer {
        width: 40%; 
    }
}

.el-row {
    padding-top: 2px;
}

body {
    background-color: #aaa;
    margin: 0px;
    overflow: hidden;
}

body.waiting * {
    cursor: wait;
}

.v-modal    {
    z-index: 2 !important;
}

.modal {
    display: none;
    overflow-y: auto;
    height: 575px;
    width: 400px;
    max-height: 80% !important;
    max-width: 80% !important;
    padding: 10px;
    position: fixed;
    z-index: 3;
    left: 2%;
    top: 2%;
    background: white;
    box-sizing: border-box;   
}

.modalInstr {
    left: 10%;
    top: 5%;
    max-height: 800px;
    max-width: 800px !important;
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 0%;
    padding: 8px;
    width: 100%;
    height: 100%;
    font-size: 14px;
}

/* roll/pitch/yaw graph styling */
.ct-grid {
    stroke: black;
    stroke-width: 1px;
    stroke-dasharray: 1px;
}

.ct-label {
    color: rgba(0,0,0,.8);
}

.ct-series-a .ct-line {
  stroke: #ff0000;
  stroke-width: 2px;
}
.ct-series-a .ct-area {
  fill: #ff0000;
}


.ct-series-b .ct-line {
  stroke: #0000ff;
  stroke-width: 2px;
}
.ct-series-b .ct-area {
  fill: #0000ff;
}


.ct-series-c .ct-line {
  stroke: #00ff00;
  stroke-width: 2px;
}
.ct-series-c .ct-area {
  fill: #00ff00;
}


.ct-series-d .ct-line {
  stroke: #880000;
  stroke-width: 2px;
}
.ct-series-d .ct-area {
  fill: #880000;
}

.ct-series-e .ct-line {
  stroke: #000088;
  stroke-width: 2px;
}
.ct-series-e .ct-area {
  fill: #000088;
}

.ct-series-f .ct-line {
  stroke: 0x008800;
  stroke-width: 2px;
}
.ct-series-f .ct-area {
  fill: 0x008800;
}

/* views styling */

.views {
    padding: 2px;
    position: relative;
    /*z-index: 2;*/
    /*display: inline-block;*/
}

.topleft {
    position: absolute;
    top: 6px;
    left: 6px;
    font-size: calc(1em);
    color: white;
}

.pilot {
    position: absolute;
    bottom: 6px;
    left: 4.3vw;
    font-size: calc(1em);
    color: yellow;
}

.pilotR {
    position: absolute;
    top: 5vw;
    left: 8.2vw;
    font-size: calc(1em);
    color: yellow;
}

.pilotF {
    position: absolute;
    top: 5vw;
    left: 4.3vw;
    font-size: calc(1em);
    color: yellow;
}