@charset "UTF-8";

        .row {
            display: flex;
            flex-wrap: wrap;
/*             gap: 10px;
 */        }

        .form-group {
            flex: 1;
            margin-bottom: 15px;
            padding: 10px;
        }

        .form-group label {
            display: block;
            font-weight: 500;
            margin-bottom: 5px;
            color: #555;
        }

        .form-group input {
            width: 100%;
            padding: 10px;
            font-size: 14px;
            border: 1px solid #ddd;
            border-radius: 5px;
            background-color: #fafafa;
        }

        .form-group input:focus {
            border-color: #007bff;
            background-color: #fff;
            outline: none;
        }
             .form-group select {
            width: 100%;
            padding: 10px;
            font-size: 14px;
            border: 1px solid #ddd;
            border-radius: 5px;
            background-color: #fafafa;
        }

        .form-group select:focus {
            border-color: #007bff;
            background-color: #fff;
            outline: none;
        }
        .form-group.title-group {
    flex-grow: 0; /* Prevents it from growing */
    flex-basis: 10%; /* 20% width */
}
   .form-group.three-group {
    flex-grow: 0; /* Prevents it from growing */
    flex-basis: 20%; /* 20% width */
}

        .submit-btn {
            width: 100%;
            padding: 12px;
            background-color: #007bff;
            border: none;
            color: white;
            border-radius: 5px;
            font-size: 16px;
            cursor: pointer;
            transition: background-color 0.3s;
            margin-top: 20px;
        }
          .addFamily-btn {
            width: 100%;
            padding: 12px;
            background-color: green;
            border: none;
            color: white;
            border-radius: 5px;
            font-size: 16px;
            cursor: pointer;
            transition: background-color 0.3s;
            margin-top: 20px;
        }
        

        .submit-btn:hover {
            background-color: #0056b3;
        }

        .hidden {
            display: none;
        }

        @media (max-width: 768px) {
            .row {
                flex-direction: column;
            }
        }

        .remove-btn {
            margin-top: 10px;
            margin-bottom: 10px;
            padding: 5px 10px;
            background-color: #dc3545;
            border: none;
            color: white;
            border-radius: 3px;
            cursor: pointer;
            
        }

        .remove-btn:hover {
            background-color: #c82333;
        }
        
        
        
        .form-control, .datatable-input {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 0.375rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.datatable-selector {
  width: auto;
  display: inline-block;
  padding-left: 1.125rem;
  padding-right: 2.125rem;
  margin-right: 0.25rem;
}
.form-select, .datatable-selector {
  display: block;
  width: 100%;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  -moz-padding-start: calc(0.75rem - 3px);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.datatable-top {
    padding: 0 0 1rem;
}
.datatable-top > nav:first-child, .datatable-top > div:first-child, .datatable-bottom > nav:first-child, .datatable-bottom > div:first-child {
    float: left;
}

.datatable-bottom>div:first-child, .datatable-bottom>nav:first-child, .datatable-top>div:first-child, .datatable-top>nav:first-child {
    float: left;
}

.exportExcel{
	margin-bottom: 10px;
}
.buttonTopMargin{
	margin-top:10px;
}
.bg-lemon-1 {
  background-color: #ffe6ea!important;
}
.bg-lemon-2 {
  background-color: #e6fee2!important;
}
.bg-lemon-3 {
  background-color: #dee1fe!important;
}
.bg-lemon-4 {
  background-color: #ffe6d9!important;
}
.lemon-padding-top td {
	padding-top:5px;
}
    .event-image {
        max-width: 100%; /* Responsive */
        max-height: 200px; /* Adjust height as needed */
        object-fit: contain; /* Ensures images cover the area without distortion */
    }
/* for payment info */


.payment-form{
		margin: 50px 500px;
	
	border: 1px solid gray;
}

/* line forming between thebuttons */

/* Target the specific area around and including the buttons */
table td,
table td *,
.actions-container,
.actions-container *,
[data-label="Actions"],
[data-label="Actions"] *,
.btn-group,
.btn-group *
/* Add any other relevant selectors here */
{
  
    text-decoration: none !important;
}

/*gallery dropdown css*/
    /* General styles for the select element */
    #type {
        padding: 10px; /* Add padding for better spacing */
        font-size: 16px; /* Set font size */
        border: 1px solid #ccc; /* Light gray border */
        border-radius: 5px; /* Rounded corners */
        background-color: #f8f8f8; /* Light background color */
        cursor: pointer; /* Change cursor to pointer */
        transition: border-color 0.3s; /* Transition for border color */
        margin-bottom:10px;
    }

    /* Style for when the select is focused */
    #type:focus {
        border-color: #007bff; /* Change border color when focused */
        outline: none; /* Remove default outline */
    }

    /* Style for the options */
    #type option {
        padding: 10px; /* Padding for options */
        background-color: #f8f8f8; /* Background color for options */
    }

    /* Change background color of options on hover */
    #type option:hover {
        background-color: #e2e2e2; /* Change background color on hover */
    }

/* for add committee member select option*/
    .select2-container {
            width: 100% !important;
        }
        .formContainer {
            margin-bottom: 20px;
        }
        
        /*donor list text wrap for c8th row */
        .textWrap8th td:nth-child(8) {
    white-space: normal; /* Allow text wrapping */
    word-break: break-word;
    overflow-wrap: break-word;
    max-width: 200px; /* Optional: Control the column width */
}

        .textWrap5th td:nth-child(5) {
    white-space: normal; /* Allow text wrapping */
    word-break: break-word;
    overflow-wrap: break-word;
    max-width: 200px; /* Optional: Control the column width */
}

 /* for admin header notification */
.flex{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	gap:15px;
}
.flex p{
	padding: 0;
	margin: 0;
	color: gray;
	font-size: 14px;
}
.align-right {
    text-align: right;
}
.flex .p-color{
	color: #045126;
}
a{
	text-decoration: none;
	color: black;
}
a:hover{
	text-decoration:none;
	color:black;
}
.abc {
	display: flex; 
		justify-content: space-between;
		gap:15px;
	
	align-items: center;
}
.margin-left{
	margin-left: auto;
}

.mr-1rem{
	margin-right:1rem;
}


