@media (min-width: 768px){
	.table-responsive>.invoiceLineItemTable tbody tr.lineItemRow  td:nth-child(1){
		min-width : 230px;
	}
	.table-responsive>.invoiceLineItemTable tbody tr.lineItemRow  td:nth-child(2){
		min-width : 260px;
	}

	.table-responsive>.invoiceLineItemTable tbody tr.lineItemRow  td:nth-child(n+4){
		min-width : 260px;
	}
		.table-responsive>.invoiceLineItemTable tbody tr.lineItemRow  td:nth-child(n+5){
		min-width : 200px;
	}
	.table-responsive>.invoiceLineItemTable tbody tr.lineItemRow  td:nth-child(n+12){
		min-width : 100px;
	}
	.table-responsive>.invoiceLineItemTable tbody tr.lineItemRow  td:nth-child(n+16){
		min-width : 260px;
	}
	.input-group-commission {
		width: 250px; !important;
	}
}
.picklist-color {
	border-radius: 20px;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}

.la-S:before {
    content: "Q";
}

.la-Q:before {
    content: "I";
}
.m-card-profile.detailViewHeader .m-card-profile__pic img{
	max-width : 200px !important;
	height: 100px;
}
.picklist-color {
	border-radius: 20px;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}
.dt-right__bg {
    background-size: cover !important;
}
/* Invoice Commission Widget Loader [Spinner] 28-03-2026   */

/* Scope everything under the unique ID to avoid conflicts with other Vtiger widgets */
#commissionwidget .commission-loading, 
#commissionwidget .commission-no-more {
    text-align: center;
    padding: 20px;
    width: 100%;
    display: none; /* Controlled by JS .show() */
}

#commissionwidget .commission-spinner { 
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 3px solid #f3f3f3;
    border-top: 3px solid #3498db; /* Vtiger Blue */
    border-radius: 50%;
    animation: commission-spin 1s linear infinite;
    margin: 0 auto;
}

/* Rename animation to be unique to this widget */
@keyframes commission-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/*
 * Date: 28-03-2026
 * Module:  Invoice Commission Widget 
 * Description: Styling applied for CommissionSummaryWidgetContent.tpl
 * Path: layouts/v7/modules/Invoice/CommissionSummaryWidgetContent.tpl
 */
 /* CARD CONTAINER */

#commissionwidget .commission-card {
    display: flex;
    justify-content: space-between;
    align-items: flex-start; /* important */
    padding: 12px 12px 12px 18px;
    border-radius: 8px;
    background: #f9fafc;
    margin-bottom: 10px;
    gap: 10px;
}

/* HOVER */
#commissionwidget .commission-card:hover {
    background: #f1f4f8;
}

#commissionwidget .commission-status{
	font-size: 12px;
    padding: 2px 5px;
    border-radius: 5px;
    margin-bottom: 5px;
    display: inline-block;
}
/* EDIT BADGE (GREEN CIRCLE) */
#commissionwidget .edit-badge {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #e6f4ea; /* light green bg */
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: 0.2s ease;
}

/* ICON */
#commissionwidget .edit-badge i {
    color: #28a745; /* success green */
    font-size: 16px;
}

/* HOVER EFFECT */
#commissionwidget .edit-badge:hover {
    background: #28a745;
}

#commissionwidget .edit-badge:hover i {
    color: #fff;
}

#commissionwidget .success-badge {
    background: #e6f4ea;  /* light green */
    color: #28a745; 
}

#commissionwidget .danger-badge {
    background: #fdecea;  /* light red */
    color: #dc3545; 
}

/* TITLE */
#commissionwidget .card-title {
    margin: 5px 0;
    font-weight: 600;
}

#commissionwidget .card-title a {
    color: #333;
    text-decoration: none;
}

#commissionwidget .more-info {
    font-size: 12px;
    color: #888;
}

/* RIGHT SIDE */
#commissionwidget .card-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
}

/* EDIT ICON */
#commissionwidget .card-right i {
    font-size: 18px;
    color: #28a745;
    cursor: pointer;
}

/* LEFT GROUP  */
#commissionwidget .card-left {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
}

/* CONTENT INSIDE LEFT */
#commissionwidget .card-left > div,
#commissionwidget .card-left > h6 {
    margin: 0;
}
/* RIGHT SIDE */
#commissionwidget .card-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
}