@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@100;200;300;400;500;600;700&display=swap');

* {
 padding: 0;
 margin: 0;
 border: none;
 text-decoration: none;
}

:root {
 --main-text: #14573a;
 --main-bg: #1b8354;
 --second-text: #222a26;
 --paragraoh-text: #313842;
 --container-width: 100%;
 --bg-box: #f2fcf8;
}

* {
 padding: 0;
 margin: 0;
 text-decoration: none;
 border: none;
 box-sizing: border-box;
}

body {
 background-color: #fff !important;
 font-family: 'IBM Plex Sans Arabic', sans-serif;
 padding-top: 1rem;
}

.container {
 width: 100%;
 max-width: var(--container-width);
 margin: 2rem auto;
 padding: 2rem 2rem;
 position: relative;
 padding-bottom: 0;
}

h2.main-title {
 display: block;
 width: fit-content;
 background-color: #1b8354;
 position: absolute;
 top: -25px;
 right: 0;
 left: 0;
 margin: 0 auto;
 filter: drop-shadow(4px 0px 12px #1b835463);
 color: #fff;
 padding: 0.7rem 1rem;
 font-weight: 500;
 font-size: 1.1rem;
 border-radius: 8px;
 padding: 1rem 3rem;
 text-align: center;
}

.conatiner-flex {
 display: flex;
 padding: 3rem 2rem 0rem;
 column-gap: 2rem;
 max-width: var(--container-width);
 flex-direction: column;

 padding-bottom: 0;
}

.table {
 font-size: 0.85rem;
 border-radius: 1rem;

 box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.1);
 margin: 1rem auto;
 width: 95%;
 overflow: hidden;
}

.table thead tr td {
 padding: 0.75rem;
 border: none;
}

.table thead tr th,
.table tbody tr td {
 text-align: center;
}

.background-custom {
 background-color: #066058 !important;
 color: #fff !important;
}
.table thead tr th {
 padding: 1rem;
 border-radius: 0.5rem;
 box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

span {
 display: block;
 color: #1b8354;
}

.sub-title {
 text-align: center;
 color: #1b8354;
 padding: 0;
 margin: 0;
}




@media screen and (max-width:768px) {
  h2.main-title {width: 95%;}
  .sub-title {margin-top: 1rem;}
.table {overflow: auto;}
}


.td-highlighted > td {background-color: #1b835413 !important;}