﻿/*スプレッドシートデザイン*/
:root {
    --jexcel_header_color: #fff;
    --jexcel_header_color_highlighted: #FFF;
    --jexcel_header_background: #fa8c31;
    --jexcel_header_background_highlighted: #fa8c31;
    /*セル*/
    --jexcel_content_color: #000;
    --jexcel_content_color_highlighted: #000;
    --jexcel_content_background: #fff;
    --jexcel_content_background_highlighted: #e6e6e3; /*選択時*/
    /*線*/
    --jexcel_border_color: #ccc;
    --jexcel_border_color_highlighted: #000;
    --jexcel_cursor: #eee;
    --active_color: #007aff;
    /*メニュー*/
    --jexcel_menu_background: #fff;
    --jexcel_menu_background_highlighted: #ebebeb;
    --jexcel_menu_color: #000;
    --jexcel_menu_color_highlighted: #000;
    --jexcel_menu_box_shadow: 2px 2px 2px 0px rgba(143, 144, 145, 1);
}

/*セル幅　自動調整*/
.jexcel {
    table-layout: auto;
    font-size: 18px;
}

#newSpreadsheet .jexcel,
#cancelSpreadsheet .jexcel {
    font-size: 1rem;
}

.selectday > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(4) :after,
.selectday > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(6) :after {
    content: "%" !important;
}

td.jexcel_row::after {
    color: #fa8c31;
}

.selectmonth > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(3) :after,
.selectmonth > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(5) :after,
.selectmonth > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(7) :after,
.selectmonth > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(9) :after {
    content: "%" !important;
}

/*食材　原価*/
.costprice > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(2) :after,
.costprice > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(5) :after,
.costprice > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(6) :after {
    content: "%" !important;
}
/*資材*/
.materialcostprice > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(2) :after,
.materialcostprice > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(6) :after {
    content: "%" !important;
}

/*粗利*/
.gressprofit > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(2) :after {
    content: "%" !important;
}

/*人件費*/
.laborcosts > #spreadsheet > div.jexcel_content > table > tbody > tr:nth-child(5) :after {
    content: "%" !important;
}

#earningsListTable tr td {
    border: 1px solid #cacaca;
    padding: 2px;
}

table#earningsListTable thead tr:first-child {
    text-align: center;
}

table#earningsListTable thead,
.text-center {
    font-weight: bold;
}

/*　スクロールバーの実装 */

table#earningsListTable {
    display: block;
    overflow-y: auto;
    width: 100%;
    height: 85vh;
}

    table#earningsListTable thead {
        position: sticky;
        border: 1px solid #cacaca;
        border-bottom: 2px solid #cacaca;
        top: 0;
        background-color: #FFFFFF;
        background-color: #f6f5f0;
    }


.zaitaku {
    background-color: #ffffcc;
}

.youchien {
    background-color: #ccffcc;
}

.shisetu {
    background-color: #ff8080;
}

.bg-gray {
    background-color: #ddd;
}