html,  body { height: 100%; }

body {
    padding: 0;
    margin: 0;
    background: rgb(255, 255, 255);;
    color: rgb(0, 0, 0);
}

button.desk_button {
    cursor: pointer;
}

button.desk_button:hover {
    background: rgba(204, 17, 17, 0.671);
}

div.col {
    background: rgba(45, 55, 70, 0.2);
    padding: 10px;
    margin: 10px;
    width: 22%;
    min-height: 500px;
    border-radius: 10px;
    display: inline-block;
    vertical-align: top;
}


.highlight {
    background: rgba(63, 107, 58, 0.2);
    padding: 10px;
    margin: 10px;
    width: 22%;
    min-height: 500px;
    border-radius: 10px;
    display: inline-block;
    vertical-align: top;
  }

div.task_momy {
    background: rgba(45, 55, 70, 0.2);
    width: 100%;
    border-radius: 10px;
    vertical-align: top;
}

div.task {
    background: rgba(45, 55, 70, 0.2);
    width: 100%;
    border-radius: 10px;
    vertical-align: top;
}

div.task:hover {
    background: rgba(204, 17, 17, 0.2);
    width: 100%;
    border-radius: 10px;
    vertical-align: top;
}


a {color: rgb(0, 0, 0);}

#main{
	width: 80%;
	margin:0 auto;
    min-width: 800px;
    margin-top: 40px;
    padding: 0 20px;
}

h1 {
    font-size: 2rem;
}
#h1 a{
	color: rgb(3, 3, 3);
	text-decoration: none;
}

.zarya { color:red;}


#footer {
	clear:both;
	text-align: center;
	font-size: 0.8em;
	width: 100%;
}

ul {
    list-style: none;
    padding: 0px;
    margin: 0px;    
}

button {
	background: #6b6b6a;
	border: 0px;
	border-top: 1px solid rgba(255,255,255,0.2);
	border-radius: 4px;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	color:white;
	padding: 10px 25px;
}

div.table_head {
    width: 100%;
    background: #e6e6dc;
    border: 1px;
	border-top: 1px solid rgba(255,255,255,0.2);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    padding: 10px 10px;
    display: table;
}
div.table_head_item {
    width: 20%;
    display: table-cell;
}

div.table_body {
    width: 100%;
    background: #ffffff;
    border: 1px;
	border-top: 1px solid rgba(255,255,255,0.2);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    padding: 10px 10px;
    display: table;
}

div.table_body_item {
    width: 20%;
    background: #ffffff;
    display: table-cell;
}


#id_jp {
    width: 300px;
    max-height: 100px;
    width: 100%;
}

div.desk {
    background: rgba(45, 55, 70, 0.2);
    padding: 10px;
    margin: 10px;
    width: 30%;
    border-radius: 10px;
    display: inline-block;
    vertical-align: top;
}

div.desk_form {
    background: rgba(45, 55, 70, 0.2);
    padding: 10px;
    margin: 10px;
    border-radius: 10px;
    display: inline-block;
    vertical-align: top;
} 
div.desk_form p{
    font-size: 25px;
}

textarea {
    font-size: inherit;
    width: 100%;
}


div.desk:hover {
    background: rgba(204, 17, 17, 0.2);
    padding: 10px;
    margin: 10px;
    width: 30%;
    border-radius: 10px;
    display: inline-block;
    vertical-align: top;
}

div.any_frame {
    background: rgba(131, 233, 145, 0.2);
    padding: 1%;
    margin: 10px;
    border-radius: 10px;
    width: 20%;
    display: inline-block;
    vertical-align: top;

}

div.any_frame_not_move {
    background: rgba(131, 144, 233, 0.2);
    padding: 1%;
    margin: 10px;
    border-radius: 10px;
    width: 90%;
    vertical-align: top;

}

div.any_frame:hover {
    background: rgba(69, 168, 39, 0.2);
    padding: 10px;
    margin: 10px;
    border-radius: 10px;
    width: 20%;
    display: inline-block;
    vertical-align: top;

}
div.work_image {
    background: rgba(95, 99, 126, 0.2);
    display: inline-block;
    padding: 10px;
    margin: 10px;
    border-radius: 10px;
    width: 30%;
}

div.work {
    background: rgba(95, 99, 126, 0.2);
    display: inline-block;
    padding: 10px;
    margin: 10px;
    border-radius: 10px; 
    width: 30%;
}

div.add_to_stock {
    width: 100%;
    background: #ffffff;
    border: 1px;
	border-top: 1px solid rgba(255,255,255,0.2);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    padding: 10px 10px;
    display: table;
}

div.add_to_stock_item {
    width: 40%;
    background: #ffffff;
    display: table-cell;
    margin-left: auto; 
    margin-right: auto;
}

h2.Mini {
    color: #FF8C00;
}

div.Mini {
    background-color: #FFE4B5;
    padding: 10px;
    border-radius: 10px; 
    box-shadow: 0 0 10px;
}

h2.Mid {
    color: #0000CD;
}

div.Mid {
    background-color: #AFEEEE;
    padding: 10px;
    border-radius: 10px; 
    box-shadow: 0 0 10px;
}

h2.Maxi {
    color: #006400;
}

div.Maxi {
    background-color: #8FBC8F;
    padding: 10px;
    border-radius: 10px; 
    box-shadow: 0 0 10px;
}


input.form-control {
    width: 250px;
}
select.form-select {
    width: 100px;
}

div.cart_head {
    width: 100%;
    background: #e6e6dc;
    border: 1px;
	border-top: 1px solid rgba(255,255,255,0.2);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    padding: 10px 10px;
    display: table;
}

div.cart_head_item {
    width: 25%;
    display: table-cell;
}

#cart_row {
    width: 100%;
    background: #ffffff;
    border: 1px;
	border-top: 1px solid rgba(255,255,255,0.2);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    padding: 10px 10px;
    display: table;
}

div.preambula {
    height: 25px;
}
div.cart_body_item {
    width: 25%;
    display: table-cell;
}

div.navigation_block {
    width: 95%;
    background: rgba(111, 118, 207, 0.2);
    padding: 10px;
    margin: 10px;
    border-radius: 10px;
    

}

button:disabled { background: #2b2b2a; color: #aaa; }
button.active { background: #027192; }
button.active:disabled { background: #012f3c; }

:root {
  --blue1: #1e90ff;
  --blue: #027192;
  --white: #ffffff;
  --sign: #ff02;
  --done: #00f2;
  --donesign: #0f02;
  --grey: #6b6b6a;
  --grey: #6b6b6a;
  --pink: #faa;
  --list-height: 150px; 
}

/* --- GENLIST --- */

.submit-buttons button{ margin:20px 10px; width: 40%;height: 15%; font-size: 3rem;}


.logout {float: right;}

ul.joblist .row{
	display: flex;
	flex-direction: row;
}

ul.joblist>li h2{clear:both;}

ul.joblist div.done, 
ul.joblist div.sign, 
ul.joblist div.doc,
pass
 {
 	width: 14%;
 	max-width: var(--list-height);
} 

div.desk_form label {
    font-size: medium;
}

div.desk_form #id_user {
    display: inline-block;
    padding: 0;
    text-align: left;

}

	


.heading {margin-bottom: 10px; overflow: hidden;}
.heading a.qr {float:right; height: var(--list-height); }
a.qr img {max-width:100%;max-height:100%;}


li.jobt .frame{
	height: var(--list-height);
	min-width: var(--list-height);
}

li.job .frame{
	height: var(--list-height);
	min-width: auto;
}

ul.joblist div.descr {
    flex: auto;
    width: auto;
    max-width: none;
}

ul.joblist li.done, .status1 {background: var(--done);}
ul.joblist li.done.sign, .status2 {background: var(--donesign);}
ul.joblist li.sign, .status2 {background: var(--sign);}

ul.joblist li {font-size: large; padding: 2px;;}


.printer ul.joblist {
    list-style: none;
    padding: 0px;
    margin: 0px;    
}
.printer ul.joblist li {
	display: block;
	width: 100%;
	overflow: hidden;
	box-shadow: 1px 1px 5px #0004;
	border-radius: 5px;
	margin:  2px ;
	padding: 2px;
}

.printers-page .qr {display: none;}
.printers-page .printer {
    display: inline-block;
	box-shadow: 1px 1px 3px #0004;
	padding: 5px 10px;
	margin: 10px;
    font-size: 1rem;
	overflow: hidden;
	min-width: 25%;
    min-height: 100px;
    
}
.printers-page .printer .jobs {display: none;}
.printers-page .printer h2 a { color:rgb(0, 0, 0); underSline-color: #fff;}
.printers-page .printer h2 {clear: both;  margin: 5px 0px;}
.printers-page ul.joblist > li { float: left; padding:0; margin: 0; position: relative; margin: 5px 0px 0px 0px; overflow: visible; padding: 2px 0px 0px 0px;}
.printers-page ul.joblist ul.type_job li {width: auto;  float: left; margin: 5px;  padding: 0;  float: left; white-space: nowrap; font-size: large;}

.printers-page .complite1 { background: rgba(250, 113, 113, 0.5);}
.printers-page .complite2 { background: rgba(253, 182, 89, 0.5);}
.printers-page .complite3 { background: rgba(125, 253, 121, 0.5);}
.printers-page .complite4 { background: rgba(126, 113, 241, 0.5);}


label {
        position:absolute;
        top: -5px;
        font-size: 15px;;

    }


.printers-page .printer.sign{background:var(--sign);}
.printers-page .printer.done{background:var(--done);}
.printers-page .printer.done.sign{background:var(--donesign);}

.tablet .group1 {width: auto; float: left}
.tablet li.job { overflow: hidden; display: block; float:left; width: auto; max-width: 250px; font-size:10px; border-radius: 3px; box-shadow: 1px 1px 3px #0006; margin: 5px 8px;  padding: 2px 10px;}
.tablet li.job span.weight {font-size: 0.8em;}
.tablet li.job.job_type0 { background: #7005;}
.tablet li.job.job_type1 { background: #7405;}
.tablet li.job.job_type2 { background: #7705;}
.tablet li.job.job_type3 { background: #0705;}
.tablet li.job.job_type4 { background: #0775;}
.tablet li.job.job_type5 { background: #0075;}
.tablet li.job.job_type6 { background: #7075;}


.tablet li.job.done {background: var(--done);}
.tablet li.job.done.sign {background: var(--donesign);}
.tablet li.job.sign {background: var(--sign);}
.tablet li>div {overflow: hidden;}
.tablet h2 {clear:both; font-size:1em; margin: 5px 0px 0px 0px;}
.tablet .group0>h2 {color: #000; margin: 20px 0px 0px 0px;}
.tablet .group2 h2 {font-size:0.5em; }
.tablet ul {overflow:hidden;}


.job-page .check-list li {
	padding: 20px;
	border-radius: 5px;
	background: var(--grey);
	box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	margin: 5px;
}
.job-page .check-list li.active{
	background:var(--blue);
}

form.edit>div {	display: flex; 	flex-direction: row; margin: 5px 0px;}
form.edit label{ width: 20%; max-width: 100px; flex: auto; position: initial;}
a.delete {float: right;}

/* --- GENLIST --- */


.panel {
    background: #333e;
    border-radius: 4px;
    position: relative;
    padding: 10px 5px 5px 5px;
    margin: 2px;

}

.panel label {
    position: absolute;
    top: 1px;
    left: 10px;
    font-size: 10px;
}

.frame {
    border-radius: 4px;
    border: 1px solid #fff2;
    position: relative;
    padding: 0.2em;
    margin: 2px;
    margin-top: 0.2em;
    font-size: 0.8em;
}


.frame .value {
    color: #fff;
}


.frame .label, .frame label {
    position: absolute;
    top: -0.7em;
    left: 5px;
    position: absolute;
    font: 400 0.7rem Arial;
}


.cpus, .memory, .process { 
	float:left;
	width: 30%;
	max-width: 400px;
	color: #fff;
}

.bar-out {
	width: 22%;
	float:left;
    margin: 1px;
    border: 1px #ccc solid;
    border-radius: 2px;
    background: #555;
}

.bar{
	text-align: center;
    background: #040;
    font-size: 10px;
    min-width: 20px;
    height: 16px;
}



/* здесь будут стили для печати */
    /* Общее */
    #main_content {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
    }
    #main-content {
        display: flex;
        margin-top: 10px;
        flex-direction: column;
        gap: 10px;
    }
    .calendar_buttons {
        background-color: black;
        color: #ececeb;
        border-width: 0px;
        border-radius:10px;
        min-height: 25px;
        min-width: 100px;
        cursor: pointer;
    }
    .calendar_buttons:hover {
        background-color: red;
    }
    #main-content .calendar_buttons {
        max-width: 100px;
    }
    #main_content label.label,
    #main-content label.label,
    form.printing_plan label.label,
    form.analytics label.label {
        all: unset;
    }
    thead .tab-label,
    tfoot .tab-label
    {
        background-color: black;
        color: white;
    }
    #datepicker {
        width: 120px;
        color: #2e383f;
    }
    td.ui-datepicker-days-cell-over.undefined.ui-datepicker-current-day.ui-datepicker-today > a {
        border: 1px solid red;
    }
    form.analytics table.summary_table thead {
        cursor: pointer;
    }
    .datepicker table tr td.active:hover,
    .datepicker table tr td.active:hover:hover,
    .datepicker table tr td.active.disabled:hover,
    .datepicker table tr td.active.disabled:hover:hover,
    .datepicker table tr td.active:active,
    .datepicker table tr td.active:hover:active,
    .datepicker table tr td.active.disabled:active,
    .datepicker table tr td.active.disabled:hover:active,
    .datepicker table tr td.active.active,
    .datepicker table tr td.active:hover.active,
    .datepicker table tr td.active.disabled.active,
    .datepicker table tr td.active.disabled:hover.active,
    .datepicker table tr td.active.disabled,
    .datepicker table tr td.active:hover.disabled,
    .datepicker table tr td.active.disabled.disabled,
    .datepicker table tr td.active.disabled:hover.disabled,
    .datepicker table tr td.active[disabled],
    .datepicker table tr td.active:hover[disabled],
    .datepicker table tr td.active.disabled[disabled],
    .datepicker table tr td.active.disabled:hover[disabled],
    .datepicker table tr td span.active.active {
        background-color: red !important;
        background-image: linear-gradient(to bottom, red, red);
    }
    .datepicker table tr td span:hover, .datepicker table tr td span.focused {
        background: red !important;
        color: white !important;
    }


    /* Календарь */
    /* template = '2_home_page.html' */
    div#button-to-table {
        margin-top: 32px;
    }
    #previous-month {
        position: relative;
        top: 32px;
        left: 1px;
        z-index: 1;
    }
    #next-month {
        position: relative;
        top: 32px;
        left: 859px;
        z-index: 1;
    }
    form.calendar table {
        border-width: 0px;
        color: #2e383f;
    }
    form.calendar th.month {
        font-size: 30px;
        font-weight: bold;
        border-width: 0px;
    }
    form.calendar td {
        text-align: center;
        font-size: 18px;
        font-weight: bold;
        display: table-cell;
    }
    form.calendar td:hover {
        background-color: #ececeb;
    }
    form.calendar ul {
        text-align: center;
        font-weight: normal;
    }
    form.calendar ul#inner_text {
        text-align: left;
        font-weight: normal;
    }

    th.mon, th.tue, th.wed, th.thu, th.fri, th.sat, th.sun {
        background-color: black;
        color: white;
    }

    div#calculator {
        padding: 10px;
        width: 250px;
        position: relative;
        top: 70px;
        display: grid;
        grid-template-rows: 60px 50px 50px 50px;
        border: solid;
        border-color: red;
        border-radius:  10px;
    }
    #label-for-calculator {
        width: 250px;
        text-align: center;
        }
    h3 {
        margin-top: 0px;
    }

    #printer-select-block, #material-select-block, #height-input-block, #count-block {
        align-content: center;
    }
    #printer-select-block, #material-select-block  {
        display: grid;
        grid-template-columns: 140px 200px;
    }
    #height {
        position: relative;
        left: 140px;
    }
    select {
        height: 20px;
        width: 101px;
    }
    form.calculator {
        display: grid;
        justify-items: start;
        align-items: start;
        grid-template-rows: 20px 400px 400px;
    }
    td[name="powder_day"] {
        background-color: #F9A828;
    }
    form.calendar td[name="powder_day"]:hover {
        background-color: #e4a33d;
    }
    td[name="optics_day"] {
        background-color: #D5ED9F;
    }
    form.calendar td[name="optics_day"]:hover {
        background-color: #d2e5a7;
    }
    td[name="cyclone_day"] {
        background-color: rgba(7, 97, 125, 0.4);
    }
    form.calendar td[name="cyclone_day"]:hover {
        background-color: rgba(7, 97, 125, 0.5);
    }
    td[name="cleaning_day"] {
        background-color: rgba(160, 35, 52, 0.5)
    }
    form.calendar td[name="cleaning_day"]:hover {
        background-color: rgba(160, 35, 52, 0.6)
    }
    div.colors {
        display:flex;
        justify-content: space-between;
    }
    div.color-title {
        text-align: left;
        font-weight: normal;
        width: 80%;
        padding: 5px;
    }
    div.color {
        width: 20%;
        margin: 10px;
        border-radius:  10px;
    }
    div#color-1 {
        background-color: #F9A828;
    }
    div#color-2 {
        background-color: #D5ED9F;
    }
    div#color-3 {
        background-color: rgba(7, 97, 125, 0.4);
    }
    div#color-4 {
        background-color: rgba(160, 35, 52, 0.5);
    }
    h3#legend-label {
        text-align: center;
        margin-bottom: 0px;
    }
    div.link {
        text-align: center;
        vertical-align: middle;
    }
    #regulation:hover {
        text-decoration: underline;
    }
    #regulation {
        text-decoration: none;
        font-weight: normal;
        color: black;
        font-size: smaller;
    }
    .tooltip-wrap {
      position: relative;
    }
    .tooltip-wrap .tooltip-content {
      display: none;
      position: absolute;
      bottom: 5%;
      left: 5%;
      right: 5%;
      background-color: #fff;
      padding: .5em;
      min-width: 10rem;
    }
    .tooltip-wrap:hover .tooltip-content {
      display: block;
    }
    #info{
        z-index: 7;
        position: absolute;
        left: 10px;
        top: 190px;
        width: 190px;
        padding: 10px;
        border: solid;
        border-color: rgba(255,0,0, 0.4);
        border-width: 2px;
        border-radius: 10px;
        background-color: white;
        box-shadow: 0px 0px 10px red;
    }
    #info label {
        padding: 15px;
    }

    #inner_text {
      list-style-type: none;
    }
    /* День */
    /* template = 'edit_day.html' */

    #full_content {
        margin-top: 10px;
        display: grid;
        justify-items: center;
        grid-template-rows: 4% 96%;
    }
    #full_content #back{
        justify-self: flex-start;
    }
    form.editDay {
        width: 700px;
        justify-content: center;
    }
    form.editDay #main_content {
        gap: 5%;
        justify-content: unset;
    }
    #main_tasks {
        width: 55%;
    }
    #extra_tasks {
        padding-top: 65px;
        width: 40%;
    }
    form.editDay label.label {
        font-weight: bold;
        font-size: 18px;
    }
    h2#date {
        text-align: center;
        border: solid;
        border-radius: 10px;
        border-color: red;
        background-color: red;
        color: #ececeb;
    }
    select#user {
        height: 25px;
        width: 100%
    }
    th.tasks {
        text-align: left;
        overflow: auto;
        width: 88%;
        font-weight: normal;
    }
    div#extra_tasks table th {
        width: 20%;
    }
    .times {
        width: 100%
    }
    #comment {
        width: 100%;
        height: 100px;
        overflow: auto;
    }
    #new-task-text {
        width: 100%;
        height: 50px;
    }
    #new_task {
        background-color: white;
        color: red;
        font-weight: bold;
        border-width: 1px;
        border-radius:10px;
        border-color: red;
        min-height: 25px;
        min-width: 45px;
        cursor: pointer;
    }
    form.editDay div.link {
        margin-bottom: 0.83em;
        text-align: left;
        font-size: 18px;
    }
    form.editDay .input {
        width: 15px;
        height: 15px;
    }

    /* Дополнительное задание для оператора на день */
    /* Создание нового материала */
    /* templates = ExtraTaskCreation.html, pr_MaterialCreation.html */
    form.mini_form {
        display: grid;
        gap: 10px;
        grid-template-rows: 70px 50px 50px;
        align-items: start;
        justify-content: center;
        justify-self: center;
        align-content: start;
        align-self: center;
        width: 350px;
    }
    form#extratask_creation {
        grid-template-rows: 60px 100px;
    }
    div#new-task {
        display: flex;
        justify-content: center;
    }
    textarea#task {
        justify-self: center;
        height: 100px;
        max-width: 253px;
    }
    h2.title {
        padding-left: 10px;
        padding-right: 10px;
        font-size: 26px;

    }
    form.mini_form div.block {
        display: grid;
        width: 98%;
        margin-left: 2%;
    }
    #material_name, #density {
        border: solid;
        border-width: 1px;
        border-radius: 10px;
        color: #2e383f;
        background-color: white;
    }
    #submit-block {
        justify-self: right;
        width: max-content;
    }
    form#extratask_creation #submit-block{
        margin-right: 15px;
    }

    /* Учет порошка */
    /* templates = material_table.html, material_table_noresult.html */
    form.material-table {
        width: 713px;
        margin-top: 10px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        justify-self: center;
        align-self: center;
    }
    form.material-table table {
        border-collapse: collapse;
    }
    form.material-table th, form.material-table td {
        border: 1px solid #2e383f;
        overflow-wrap: normal;
        width: 100px;
        height: 25px;
    }
    form.material-table .inputs {
        border-width: 0px;
        width: 100px;
    }
    form.material-table #comment {
        width: 300px;
        height: 30px;
        wrap: soft;
    }
    form.material-table #material-name {
        width: 200px;
    }
    form.material-table .inputs:focus-visible {
        outline: 1px solid #2e383f;
    }
    form.material-table #datepicker-block,  form.material-table #submit-button-block{
        align-self: flex-end;
    }
    form.material-table #noresult {
        align-self: center;
    }

    /* Порядок операторов */
    /* template = reorder_operators.html */
    form.reordering {
        display: flex;
        flex-direction: column;
        gap: 10px;
        justify-self: center;
    }
    form.reordering td {
        text-align: center;
        font-size: 18px;
        font-weight: bold;
        transition: background-color 0.5s;
    }
    form.reordering td.operator {
        border: 2px solid red !important;
        border-color: red;
        cursor: move;
    }
    form.reordering td.operator:hover {
        background-color: #ececeb;

    }
    form.reordering .selected {
      opacity: 0.6;
    }
    form.reordering div.block {
        margin-bottom: 10px;
        display: flex;
    }
    form.reordering div#main_function {
        align-self: center;
    }
    form.reordering #datepicker_block {
        display: flex;
        flex-direction: column;
        width: 25%;
        margin-left: 20px;
    }
    form.reordering #date_label, form.reordering #datepicker {
        font-size: 17px;
    }
    form.reordering #date_label {
        margin-bottom: 3px;
        font-weight: bold;
    }
    form.reordering #datepicker {
        height: 25px;
        font-weight: normal;
    }
    form.reordering #save {
        margin-left: 400px;
    }

    /* Статистика операторов */
    /* template = c_OperatorsAnalytics.html */
    form#orders_analytics {
        display: flex;
        flex-direction: column;
    }
    form.analytics div.main_info {
        display: flex;
        flex-direction: row;
        width: 100%
    }

    form.analytics #filter-block {
        align-self: flex-start;
        display: flex;
        flex-direction: column;
        margin: 10px;
        gap: 10px;
    }
    form#orders_analytics #table-block,
    form#orders_analytics div.tables {
        width: 70%;

    }
    form#orders_analytics div.tables {
        display: flex;
        flex-direction: row;
    }
    form.analytics #material_filter {
        display: flex;
        flex-direction: column;

    }
    form.analytics #filter, form.analytics #from {
        cursor: pointer;
        width: 230px;
        height: 30px;
    }
    form.analytics #from {
        margin-top: 5px;
    }
    form.analytics #back_block {
        align-self: flex-start;
        margin: 10px;
    }
    form.analytics table.summary_table {
        border-collapse: collapse;
        table-layout: fixed;
        overflow: hidden;
        border-width: 1px;
        margin-left: 10px;
    }
    form.analytics th, form.analytics td {
      border: 1px solid #2e383f !important;
      text-align: center !important;
    }
    form.analytics th.tab-label:hover {
        background-color: red;
    }
    form.analytics .periods {
        display: flex;
        align-items: center;

    }
    form.analytics #show {
        margin-left: 5px;
    }

    /* Журнал печати */
    /* template = pr_OrdersTable.html */
    form.printing_register {
        width: max-content;
    }
    form.printing_register #search_n_neworder {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        flex-direction: column;
        margin-top: 10px;
        gap: 10px;
        width: 1000px;
    }
    form.printing_register #search_block {
        display: flex;
        width: 100%;
        justify-content: flex-end;
        /* justify-content: flex-end; */

        /* margin-left: 900px; */
        flex-direction: row;
        gap: 5px;

    }
    form.printing_register #submit_n_new {
        display: flex;
        justify-content: flex-start;
        flex-direction: row;
        gap: 5px;
    }
    form.printing_register div#hide_tab_block {
        position: relative;
        left: 210px;

         /* top: 25px;
         margin-left: 780px; */
    }
    form.printing_register table#printing_register_table {
        border-collapse: collapse;
        table-layout: auto;
    }
    form.printing_register th, form.printing_register td {
      border: 1px solid #2e383f;
    }
    form.printing_register .text_input {
        min-width: 150px;
        overflow: auto;
        border: 0px;
    }
    form.printing_register select[id^="printer&"] {
        min-width: 80px;
    }
    form.printing_register .num_input {
        max-width: 80px;
    }
    form.printing_register .date_input {
        max-width: 80px;
    }
    form.printing_register input[id^="duration&"] {
        max-width: 40px;
    }
    form.printing_register input[id^="amount&"] {
        max-width: 60px;
    }
    form.printing_register #show_hide {
        background-color: white;
        color: red;
        font-weight: bold;
        border-radius: 10px;
        border: solid 1px red;
        box-shadow: unset;
        padding: unset;
    }
    form.printing_register input.search, input[id^="date"], .showimg {
        cursor: pointer !important;
    }
    form.printing_register #ready_cell {
        justify-items: center;
    }
    form.printing_register input[type="checkbox"] {
        width: 65px !important;
        height: 20px;
    }
    form.printing_register input.input, select.input {
        border: 0 !important;
    }
    form.printing_register #next-month,
    form.printing_register #previous-month {
        position: unset;

    }
    form.printing_register #months_navigation {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;

    }
    form.printing_register #next-previous {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%
    }
    form.printing_register .hidden-cell,
    form.printing_register #cell_delete {
        border: 0px;
    }

    /* Новый заказ */
    /* template = pr_OrderCreation.html */
    form.order_creation {
        display: flex;
        flex-direction: column;
        width: 650px;
        border: solid;
        border-width: 1px;
        border-radius: 20px;
        border-color: red;
        align-self: center;
    }
    form.order_creation div.block {
        display: grid;
        align-items: start;
    }
    form.order_creation h2.title {
        text-align: center;
    }
    form.order_creation #main_n_regular {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        width: 100%;
        padding-bottom: 10px;
    }
    form.order_creation #order_creation_main {
        display: grid;
        gap: 10px;
        align-items: start;
        justify-content: center;
        align-content: start;
    }
    form.order_creation #comment_block {
        display: flex;
        flex-direction: column;
        height: 80px;
    }
    form.order_creation .label_container {
        height: 30%;
    }
    form.order_creation #comment {
        height: 100% !important;
    }
    form.order_creation label.label {
        font-weight: bold !important;
    }
    form.order_creation .input,
    form.order_creation #material,
    form.order_creation #datepicker,
    form.order_creation #comment,
    form.order_creation select#printer,
    form.order_creation select#priority{
        border: solid;
        border-width: 1px;
        border-radius: 10px;
        color: #2e383f;
        background-color: white;
        width: 250px;
        margin-bottom: 0px;
        height: 25px;
        padding-left: 5px;
    }
    form.order_creation #ready_block,
    form.order_creation #regular_block,
    form.order_creation #important_block {
        display: flex;
        align-self: flex-start;
    }
    form.order_creation #ready,
    form.order_creation #regular,
    form.order_creation #important {
        margin-top: 0px;
        height: 17px;
        width: 17px;
        border: solid;
        border-width: 1px;
        border-radius: 5px;
    }
    form.order_creation #submit-block {
        justify-self: right;
    }
    form.order_creation input[type=file]::file-selector-button {
        cursor: pointer;
        background-color: black;
        color: white;
        border-width: 0px;
        border-radius: 10px;
        min-height: 25px;
        min-width: 100px;
    }
    form.order_creation input[type=file]::file-selector-button:hover {
        background-color: red;
    }
    form.order_creation #block_orders {
        justify-items: start;
        overflow-y: auto;
    }
    form.order_creation #orders {
        display: flex;
        align-items: center;
        margin-bottom: 10px;

    }
    form.order_creation .patterns {
        margin-right: 10px !important;
    }
    form.order_creation div#upload_files,
    form.mini_form div#upload_files{
        gap: 10px;
    }
    form.order_creation div#preview-container,
    form.mini_form div#preview-container{
        display: flex;
        justify-content: center;
        cursor: pointer;
        height: 100px;
        max-width: 253px;
        background: rgba(0,0,0, 0.07);
        border: 1px solid red;
        border-radius: 5px;
        overflow: auto;
    }
    form.order_creation input#new_operation {
        background-color: white;
        color: red;
        font-weight: bold;
        border-width: 1px;
        border-radius:10px;
        border-color: red;
        min-height: 25px;
        min-width: 45px;
        cursor: pointer;
        align-self: right;
    }

    /* Статистика по заказчикам */
    /* template = pr_OrdersAnalytics.html */
    form.analytics th.customer {
        width: 60%;
        word-wrap: break-word;
    }
    form.analytics #table-block {
        display: flex;
        align-content: center;
        justify-content: center;
    }
    form.analytics tfoot .tab-label:hover {
        background-color: black;
    }
    form#orders_analytics .customer {
        cursor: pointer;
    }

    /* План печати */
    /* template = pp_PrintingPlanTable.html */
    #search_form {
        margin-top: 10px;
        margin-bottom: 10px !important;
    }
    form#search_form div#printer_block div {
        display: flex;
        flex-direction: row;
        gap: 5px;
    }
    form.printing_plan #new {
        display: flex;
        flex-direction: row;
        gap: 5px;
        margin-bottom: 10px;
    }
    form.printing_plan table {
        border-collapse: collapse;
        table-layout: auto;
    }
    form.printing_plan table th,
    form.printing_plan table td {
        border: 1px solid #2e383f;
    }
    form.printing_plan tr.important {
        border-color: red !important;
        border: solid 3px;
    }
    form.printing_plan th.showbtn,
    form.printing_plan td#cell_hide,
    form.printing_plan td#cell_delete,
    form.printing_plan td#cell_defect{
        border: 0px;
    }
    form.printing_plan td[id^="operations"] {
        width: 230px;
        padding-left: 5px;
    }
    form.printing_plan #cell_material {
        max-width: 100px;
        padding-left: 5px;
        padding-right: 5px;
    }
    form.printing_plan td[id^="datetime_end"] {
        width: 100px;
        padding-left: 5px;
    }
    form.printing_plan td#cell_hide,
    form.printing_plan td#cell_delete,
    form.printing_plan td#cell_defect{
        padding-left: 10px;
    }
    form.printing_plan .input {
        border: 0px;
    }
    form.printing_plan select[id^="priority"] {
        width: 140px;
        font-size: medium;

    }
    form.printing_plan input[type="number"].input {
        width: 100px;
        border-width: 0px;
    }
    form.printing_plan td#start_cell {
        padding-left: 1%;
    }
    form.printing_plan td#ready_cell {
        padding-left: 2%;
    }
    form.printing_plan .button,
    form.printing_register .button#delete {
        cursor: pointer;
        background-color: white;
        color: red;
        font-weight: bold;
        border-width: 1px;
        border-radius:10px;
        border-color: red;
        min-height:25px;
        min-width: 25px;
    }
    /* Создание записи в таблицу План печати */
    /* template = pp_PrintingPlanCreation.html */
    #main_content label.checkbox_label {
        all: unset;
    }
    form.order_creation #main_content {
        justify-content: center;
        gap: 10%;
        padding-right: 5%;
        padding-left: 5%;
        padding-bottom: 5px;
    }
    form.order_creation #main_content #block_orders {
        overflow-y: auto;
        max-height: 550px;
    }
    form.order_creation #main_content #orders {
        display: flex;
        flex-direction: column;

    }
    form.order_creation .order_content {
        display: flex;
        overflow-x: auto;
    }
    /* Готовые заказы */
    /* template = pp_ReadyOrdersTable.html */

    form#form_pagination div#pagination {
        display: flex;
        flex-direction: row;
        gap: 5px;
        align-self: center;
        justify-self: center;
    }
    form.printing_plan {
        display: flex;
        flex-direction: column;

    }
    form.printing_plan #ready-orders-table-block {
        align-self: center;
    }
    form.printing_plan table#ready_orders td#num,
    form.printing_plan table#ready_orders td#drawing_cell{
        text-align: center;
    }
    form.printing_plan table#ready_orders td#num {
        width: 6%;
    }
    form.printing_plan table#ready_orders td#cell_name {
        width: 30%;
        padding-left: 3px;
    }
    form.printing_plan table#ready_orders td#cell_comments {
        width: 40%;
    }
    form.printing_plan table#ready_orders td#cell_ready {
        width: 10%;
        padding-left: 2.5%;
    }

@media print {
    /* здесь будут стили для печати */
    

    #main {
        background: #fff;
        color: #000;
    }
    
    h1, #h1 a {color: #000;}
    .edit{display: none;}
    .frame{border: 1px solid #aaa;}
    .frame label{text-shadow: none; background: #fff; top:-1.1em;}
    
    ul.joblist>li {break-inside: avoid;}
    
    ul.joblist>li h2{ margin: 2px 5px;}
   
    .printer ul.joblist>li { background: #aaa2 !important; }
    
    h1, #h1 {font-size:2.5em; margin: 5px 20px;}
    
  
    .log-div {display: none;}
    .menu {display:none;}

}

.logout-form{
    display: inline;
    margin-left: 10px;
}