/* wrapper */
.contracts-wrapper{
width:100%;
/* font-family:Arial, Helvetica, sans-serif; */
}

/* top controls */
.contracts-top{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:10px;
}

.contracts-per-page{
font-size:14px;
display:none;
}

.contracts-per-page select{
padding:4px 6px;
border:1px solid #ccc;
border-radius:4px;
margin:0 5px;
}

/* table */
#contracts-table{
width:100%;
border-collapse:separate;
border-spacing:0;
border-radius:12px;
overflow:hidden;
box-shadow:0 4px 12px rgba(0,0,0,0.15);
background:#fff;
table-layout:fixed; /* This allows us to control column widths precisely */
}

/* ============================================ */
/* CUSTOM COLUMN WIDTHS - APPLIED TO ALL HEADERS AND CELLS */
/* ============================================ */

/* Column 1: Contract Number - Decreased width */
#contracts-table th:nth-child(1),
#contracts-table td:nth-child(1) {
width: 12%;
min-width: 100px;
}

/* Column 2: Title - Increased width */
#contracts-table th:nth-child(2),
#contracts-table td:nth-child(2) {
width: 23%;
min-width: 180px;
}

/* Column 3: Organization */
#contracts-table th:nth-child(3),
#contracts-table td:nth-child(3) {
width: 15%;
min-width: 120px;
}

/* Column 4: Supplier */
#contracts-table th:nth-child(4),
#contracts-table td:nth-child(4) {
width: 15%;
min-width: 120px;
}

/* Column 5: Type */
#contracts-table th:nth-child(5),
#contracts-table td:nth-child(5) {
width: 12%;
min-width: 100px;
}

/* Column 6: Start Date - Smaller width */
#contracts-table th:nth-child(6),
#contracts-table td:nth-child(6) {
width: 8%;
min-width: 90px;
text-align: center;
}

/* Column 7: End Date - Smaller width */
#contracts-table th:nth-child(7),
#contracts-table td:nth-child(7) {
width: 8%;
min-width: 90px;
text-align: center;
}

/* Column 8: PDF Document - Smallest width */
#contracts-table th:nth-child(8),
#contracts-table td:nth-child(8) {
width: 7%;
min-width: 80px;
}

/* header styling */
#contracts-table thead tr:first-child th{
background:#ffc20e;
color:#fff;
font-weight:500;
font-size:16px;
line-height:24px;
text-align:left;
padding:14px 16px;
}

/* Apply column alignments to headers */
#contracts-table thead tr:first-child th:nth-child(1),
#contracts-table thead tr:first-child th:nth-child(2) {
text-align: left;
}

#contracts-table thead tr:first-child th:nth-child(6),
#contracts-table thead tr:first-child th:nth-child(7) {
text-align: center;
}

#contracts-table thead tr:first-child th:nth-child(8) {
text-align: center;
}

/* rounded header corners */
#contracts-table thead tr:first-child th:first-child{
border-top-left-radius:12px;
}

#contracts-table thead tr:first-child th:last-child{
border-top-right-radius:12px;
}

/* search row - apply same widths */
.contracts-search th {
background:#f6f6f6;
padding:8px;
border-bottom:1px solid #ddd;
}

/* Ensure search inputs respect column widths */
.contracts-search th:nth-child(1),
.contracts-search th:nth-child(2),
.contracts-search th:nth-child(3),
.contracts-search th:nth-child(4),
.contracts-search th:nth-child(5),
.contracts-search th:nth-child(6),
.contracts-search th:nth-child(7),
.contracts-search th:nth-child(8) {
width: inherit; /* Inherit widths from parent column definitions */
}

/* search input styling */
.contracts-search input{
max-width:75%;
padding:6px 14px 6px 10px;
border:1px solid #ccc;
border-radius:16px;
font-size:13px;
background-image:url("../../assets/images/search-icon.svg");
background-repeat:no-repeat;
background-position:right 10px center;
background-size:14px;
}

/* Hide icon when user types */
.contracts-search input:focus{
background-image:none;
}

/* Center search inputs for date columns */
.contracts-search th:nth-child(6) input,
.contracts-search th:nth-child(7) input,
.contracts-search th:nth-child(8) input {
text-align: center;
}

/* body cells */
#contracts-table tbody td{
padding:12px 4px;
font-size:14px;
color:#444;
font-size:16px;
line-height:23px;
color:#5c5c5c;
font-weight:400;
}

#contracts-table td{
padding:12px 4px;
border-right:2px solid #ddd;
border-bottom:2px solid #ddd;
}

/* Apply alignment to body cells */
#contracts-table tbody td:nth-child(1),
#contracts-table tbody td:nth-child(2) {
text-align: left;
}

#contracts-table tbody td:nth-child(6),
#contracts-table tbody td:nth-child(7),
#contracts-table tbody td:nth-child(8) {
text-align: center;
}

/* alternating rows */
/* #contracts-table tbody tr:nth-child(even) td{
background:#f1f1f1;
} */

/* hover row */
#contracts-table tbody tr:hover td{
background:#e9e9e9;
}

/* last row rounded */
#contracts-table tbody tr:last-child td:first-child{
border-bottom-left-radius:12px;
}

#contracts-table tbody tr:last-child td:last-child{
border-bottom-right-radius:12px;
}

/* footer */
.contracts-footer{
display:flex;
justify-content:space-between;
align-items:center;
margin-top:12px;
font-size:14px;
color:#666;
}

/* pagination */
#contracts-pagination button{
margin:2px;
padding:0;
border:1px solid transparent;
background:none;
color:#000;
cursor:pointer;
}

#contracts-pagination button:hover{
background:transparent;
}

/* active page */
#contracts-pagination button.active{
background:transparent;
border-color:transparent;
color:#000;
font-weight:bold;
}

/* Title column - ensure content wraps properly */
#contracts-table td:nth-child(2) {
word-wrap: break-word;
word-break: break-word;
white-space: normal;
}

/* PDF column styling */
#contracts-table td:nth-child(8) a {
display: inline-block;
white-space: nowrap;
padding: 4px 8px;
font-size: 13px;
text-decoration: none;
background-color: #ffc20e;
color: #fff;
border-radius: 4px;
transition: background-color 0.3s ease;
}

#contracts-table td:nth-child(8) a:hover {
background-color: #e5b00c;
text-decoration: none;
}

/* Make Start/End Date columns smaller (keeping for backward compatibility) */
#contracts-table th.col-date,
#contracts-table td.col-date {
width: 8%;
text-align: center;
}

/* Responsive adjustments for smaller screens */
@media screen and (max-width: 1200px) {
    #contracts-table th:nth-child(2),
    #contracts-table td:nth-child(2) {
        width: 20%;
    }
    
    #contracts-table th:nth-child(3),
    #contracts-table td:nth-child(3),
    #contracts-table th:nth-child(4),
    #contracts-table td:nth-child(4) {
        width: 13%;
    }
}

@media screen and (max-width: 992px) {
    /* On medium screens, make table scrollable horizontally */
    .contracts-wrapper {
        overflow-x: auto;
    }
    
    #contracts-table {
        min-width: 900px;
    }
}

body .text-decor-con a{
text-decoration:none !important;
}
/* CONTAINER SETUP */
.funding-graph {
  position: relative;
  max-width: 900px;
  margin: 80px auto;
  font-family: 'Helvetica Neue', Arial, sans-serif;
}

/* THE VERTICAL Y-AXIS */
.funding-graph::before {
  content: "";
  position: absolute;
  left: 100px; 
  top: -40px;
  bottom: 0px; /* Meet X-axis exactly */
  width: 1px;
  background: #333;
  z-index: 1;
}

/* THE THICK LINE CONNECTOR (Using your new P tag) */
.graph-thick-line {
  display: block !important; /* Override hide rule */
  position: absolute;
  left: 88px; /* Centered on the 100px axis */
  top: 110px; /* Starts below the first circle */
  width: 25px;
  height: 85px; /* Bridges the gap to the next circle */
  background: #eee;
  border-radius: 4px;
  z-index: 2;
  margin: 0 !important;
}

/* ROW WRAPPER */
.graph-row {
  position: relative;
  height: 130px; 
  display: flex;
  align-items: center;
  margin-bottom: 40px;
	 overflow: visible;
}

/* THE RINGED CIRCLES */
.graph-row::before {
  content: attr(data-label);
  position: absolute;
  left: 40px; 
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: var(--row-color);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 16px;
  z-index: 3;
  box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--row-color);
	text-align:center;
}

/* ✅ ROW TOOLTIP (NEW) */
.graph-row:hover::after {
  content: attr(data-value);
  position: absolute;
  top: -25px;
  left: 100px;
  transform: translateX(-50%);
  background: #333;
  color: #fff;
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 9999;
}

/* THE BARS */
.bar {
  position: absolute;
  left: 100px; 
  height: 48px;
  background: var(--row-color);
  z-index: 2;
  transition: width 1s ease-in-out;
	margin-top:0;
}

/* THE ARROW TIP */
.bar::after {
  content: "";
  position: absolute;
  right: -24px;
  top: 0;
  border-top: 24px solid transparent;
  border-bottom: 24px solid transparent;
  border-left: 24px solid var(--row-color);
}

/* HOVER TOOLTIP */
.bar:hover::before {
  content: attr(data-display-value);
  position: absolute;
  top: 15px;
  right: -100px;
  background: #333;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 100;
}

/* 
.graph-row:hover::before{
content: attr(data-display-value);
  position: absolute;
  top: -35px;
  right: -24px;
  background: #333;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 10;

} */

/* HIDE DATA TAGS */
.graph-label, .graph-value, .graph-max, .graph-divider { 
  display: none !important; 
}

/* THE HORIZONTAL X-AXIS */
.graph-axis {
  position: relative;
  margin-left: 100px !important;
  width: 600px;
  height: 1px;
  background: #333;
  margin-top: 0px; 
}

/* AXIS LABELS */
.graph-axis span {
  position: absolute;
  top: 15px;
  font-size: 14px;
  color: #666;
  transform: translateX(-50%);
  white-space: nowrap;
	margin-top:0;
}

/* TICK MARKS */
.graph-axis span::before {
  content: "";
  position: absolute;
  top: -15px;
  left: 50%;
  width: 1px;
  height: 10px;
  background: #333;
}

/* faq ans css */
.wpsi-faq-answer  {
		font-size:16px !important;
/* 	   max-height:100% !important;
       height:100% !important;  */
	}

.wpsi-faq-question {
  font-weight:500 !important ;
}
.wpsi-faq-item {
    background: #1f6ea5;
    color: #fff;
    border-radius: 12px;
    padding: 15px;
    min-height: 50px !important;
 
    cursor: pointer;
}


