/* ------------------------------------------------------------------------------ */
/* ****************************************************************************** */
/* --------- (C) Copyright 2023/2024 by machtWeb | Reinhard Lange --------------- */
/* ---------------------- machtWeb.de | relaXits@machtWeb.de -------------------- */
/* ------------------------------------------------------------------------------ */
/* update	->													                            6.00/02 - 10-09-23
/* layout	-> impressum / datenschutz / bewerbung                                  */
/* file 	-> design/add-table.css                                                 */
/* colors	-> http://www.color-hex.com | https://oklch.com                         */
/* ------------------------------------------------------------------------------ */
/* TABLE */
table, th, td {
    padding: 4px 6px;
    border-collapse:collapse;
    border:var(--set-tab-border); /* self 0px solid #aaa; */
}
/* NOT IN USE */
/* table {} */

.data-table {
    width:var(--set-tab-width);
    margin:var(--set-tab-margin);
}

/* NOT IN USE */
th {
    background: #e6f9ff;
}

tr:nth-child(even) {
    background:none; /* self rgba(108, 255, 209, 0.2); */
}

/* FONT-SIZE FOR CELLS */
table, th, td {
    font-size: .98rem;
}
  
/* FIRST COLUMNS - TEXT TOP */
.first-column {
    vertical-align: top;
    padding: 4px 4px 0 6px;
    /* font-size:1.1rem; */
    color:var(--txt-col-1st);
}
/* TEST ONLY -> background for empty cells */
td:empty {
    background:var(--set-tab-empty); /* self rgb(0,0,0,.04); */
  }
/* IMAGES */
img {
    border:none !important;
}

/* ------------------------------------------------------------------------------ */
/* MEDIA SCREEN                                                                   */
/* ------------------------------------------------------------ 6.0/02 - 10-09-23 */
/* SMARTPHONE */
@media only screen and (max-width: 768px) {
    thead {
      display:none;
    }

    .data-table {
      width:calc(100% - 0em);
    }

    td {
      display:block;
      padding:.3rem .5rem;
    }
    /* images -> no-show */
    .hide-img {
      display:none !important;
    }
        /* data-title column -> no-show */
    td:before {
      content:'';
      display:none;
    }
    td:empty {
      display:none;
    }
  }
/* ------------------------------------------------------------------------------ */
/* END */	
/* ------------------------------------------------------------------------------ */