

/* ======= Begin: skin.css ======= */
@import url('https://fonts.googleapis.com/css2?family=Karla:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
@import url("https://calculatorexpress.com/ICONS_V6/numbers/icons.css");

	:root{
		--sgsr-theme: #6d78f2;

	}

  .sgsr-render-error {
    padding: 8px;
    background-color: #e91e6329;
    color: #e91e63;
    font-size: 16px;
    width: fit-content;
    border-radius: 6px;
    text-transform: uppercase;
    margin: auto;
    margin-bottom: 14px;
    display: none;
}

.sgsr-refresh {
    background-color: var(--sgsr-theme);
    color: white;
    margin: 7px;
    width: fit-content;
    padding: 2px 12px;
    border-radius: 16px;
    margin: 7px auto;
    display: none;
}

.sgsr-flash {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

    [sgsr-tab-section="1"] {
  padding: 1rem;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  margin-bottom: 20px;
}

    [sgsr-tab-section="1"] a.sgsr-hyperlink{
        text-decoration: none;
    }


    [sgsr-tab-section="1"] [sgsr-round-img="1"]{border-radius: 50%;}


     [sgsr-tab-section="1"][sgsr-card="s-r"] {
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1);
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    border-radius: 12px;
} 

[sgsr-tab-section="1"][sgsr-card="s-f"] {
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1);
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    border-radius: 0px;
}  

[sgsr-paging="0"][sgsr-scroll="scrollable"] .sgsr-responsivess{
  max-height: 600px;
  overflow-y: auto;
  position: sticky;
}

[sgsr-paging="0"][sgsr-scroll="scrollable"] .sgsr-responsivess thead{
  position: sticky;
  top: 0;
}


    
    table[sgsr-table="1"] [sort="1"]{cursor: pointer;}
    table[sgsr-table="1"] [sort="1"]:after{
        content: "\00a0 \f0dc";
        font-family: "Font Awesome 6 Pro";
        font-weight: 900;
}
    


[sgsr-tab-section="1"] .sgsr-responsivess {
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    border: 0;
}


[sgsr-tab-section="1"] table[sgsr-table="1"] {
  border-collapse: collapse;
  width: 100%;
  background-color: #fff;
  box-shadow: none;
  transition: box-shadow 0.3s ease;
  border:0;
}

[sgsr-tab-section="1"] .sgsr-responsivess {
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  border:0;
}

[sgsr-tab-section="1"][sgsr-center-txt="1"] table[sgsr-table="1"]{
    text-align: center;
    font-size: 16px;
    color: black;
}

[sgsr-tab-section="1"] [sgsr-card="1"]{
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

[sgsr-tab-section="1"] thead {
  background-color: var(--sgsr-theme);
  color: #fff;
}

[sgsr-tab-section="1"] thead th {
/*  text-align: left;*/
  padding: 14px;
  font-weight: 600;
/*  font-size: 16px;*/
  border-width: 0;
}

[sgsr-tab-section="1"] tbody td {
  padding: 12px 14px;
  border-bottom: 1px solid #eee;
  color: #333;
  border-width: 0;
}

[sgsr-tab-section="1"] tbody tr:nth-child(even) {
  background-color: #f9f7ff;
}

[sgsr-tab-section="1"] tbody tr:hover {
  background-color: #f0efff;
}

[sgsr-tab-section="1"] .searchInput,
[sgsr-tab-section="1"] .rowsPerPage,
[sgsr-tab-section="1"] .pagination-controls select {
  padding: 8px 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  margin: 8px 0;
  font-size: 14px;
/*  max-width: 100px;*/
}

[sgsr-tab-section="1"] input.searchInput{
    width: 100%;
    max-width: 98%;
}

[sgsr-tab-section="1"] .searc-box{
    margin: auto;
    max-width: 98%;
}


[sgsr-tab-section="1"] .pagination-controls {
  margin-top: 10px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

[sgsr-tab-section="1"] .pagination-controls button {
  background-color: var(--sgsr-theme);
  color: white;
  border: none;
  padding: 8px 12px;
  border-radius: 6px;
  cursor: pointer;
}

[sgsr-tab-section="1"] .pagination-controls button:hover {
  background-color: #5864d9;
}

[sgsr-tab-section="1"] .pagination-controls span, 
[sgsr-tab-section="1"] .pagination-controls label {
    font-size: 14px;
    width: fit-content;
    min-width: 85px;
    color: black;
}

[sgsr-tab-section="1"] .pagination-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 10px;
  gap: 10px;
}

[sgsr-tab-section="1"] .sgsr-inline-group {
  display: flex;
  align-items: center;
  gap: 6px;
}

[sgsr-tab-section="1"] .sgsr-group-left,
[sgsr-tab-section="1"] .sgsr-group-center,
[sgsr-tab-section="1"] .sgsr-group-right {
  display: flex;
  align-items: center;
  gap: 10px;
}

[sgsr-tab-section="1"] .pagination-controls select {
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid #ccc;
  font-size: 14px;
  min-width: 85px;
  max-width: 100px;
}




@media screen and (max-width: 600px) {
  [sgsr-tab-section="1"] .sgsr-responsivess {
    overflow: auto;
/*    max-height: 400px;*/
    position: relative;
  }

  [sgsr-tab-section="1"] .sgsr-responsivess table {
    width: 100%;
    border-collapse: collapse;
    table-layout: auto;
  }

  [sgsr-tab-section="1"] .sgsr-responsivess table th {
    min-width: 100px;
  }

  [sgsr-tab-section="1"] thead th {
    position: sticky;
    top: 0;
/*    background-color: var(--sgsr-theme);*/
    color: white;
    z-index: 1;
    padding: 7px;
    font-weight: 400;
    font-size: 12px;
    border-width: 0;
  }

  [sgsr-tab-section="1"] tbody td {
    padding: 1px 2px;
    border-bottom: 1px solid #eee;
    color: #333;
    font-size: 12px;
  }

  

}


[data-sgsr="b"] {
    text-align: center;
    color: #5f5f60;
    font-weight: 600;
    font-size: 11px;
    cursor: pointer;
    letter-spacing: 4px;
}


@media screen and (max-width: 600px) {
  [sgsr-tab-section="1"] .pagination-controls {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  /* Group: Prev, Page Info, Next — stay inline */
  [sgsr-tab-section="1"] .pagination-controls .sgsr-group-left {
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
  }

  /* Groups with label + select */
  [sgsr-tab-section="1"] .pagination-controls .sgsr-group-right,
  [sgsr-tab-section="1"] .pagination-controls .sgsr-group-center {
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
  }

  [sgsr-tab-section="1"] .sgsr-inline-group {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 6px;
  }
}

/* ======= End: skin.css ======= */


/* ======= Begin: options.css ======= */
[sgsr-tab-section="1"] [sgsr-up="1"]:before{
	        content: "\f0de \00a0";
	        font-family: "Font Awesome 5 Pro";
            font-weight: 900;
            color: #3cd43c;
		}


		[sgsr-tab-section="1"] [sgsr-up="0"]:before{
	        content: "\f0dd \00a0";
	        font-family: "Font Awesome 5 Pro";
            font-weight: 900;
            color:red;
/*            color: #F44336;*/
		}


[sgsr-tab-section="1"] [sgsr-rating-star="1"]:before{
	        content: "\f005";
	        font-family: "Font Awesome 5 Pro";
            font-weight: 900;
/*            color: #ffa500;*/
		}


		[sgsr-tab-section="1"] [sgsr-rating-star="0"]:after{
	        content: "\f005";
	        font-family: "Font Awesome 5 Pro";
            font-weight: 300;
/*            color: #ffa500;*/
		}

		[sgsr-tab-section="1"] [sgsr-rating-star="0.5"]:after{
	        content: "\f5c0";
	        font-family: "Font Awesome 5 Pro";
            font-weight: 900;
/*            color: #ffa500;*/
		}


[sgsr-tab-section="1"] .sgsr-rating-track {
    background-color: #c2c2c2;
    display: inline-block;
    height: 8px;
    width: 80%;

    position: relative;
    text-align: left;
}

[sgsr-tab-section="1"] .sgsr-rating-fill {
    background-color: red;
    display: inline-block;
    height: 8px;
    width: 50%;
    position: absolute;
}


/* ======= End: options.css ======= */
