/* ============================================================
   RetaPOS Compare pages stylesheet — hub + 5 vs-competitor pages
   Loaded only on the Compare controller (see _Layout.cshtml).
   Modernizes the feature comparison tables: navy header,
   highlighted RetaPOS column, tinted yes/no cells.
   ============================================================ */

/* Rounded, elevated table container */
.table-responsive {
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid #eef1f6;
	box-shadow: 0 12px 36px rgba(20, 28, 77, 0.08);
}

/* Header: navy, with the RetaPOS column in brand blue */
.table thead.table-dark th {
	background: linear-gradient(135deg, #141c4d, #1d2a6b) !important;
	color: #fff !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	vertical-align: middle;
	padding: 1rem;
	font-weight: 700;
}
.table thead.table-dark th:nth-child(2) {
	background: linear-gradient(135deg, #2563eb, #3b82f6) !important;
}

/* Subtle highlight down the RetaPOS column */
.table tbody td:nth-child(2) {
	background: rgba(37, 99, 235, 0.04);
}

/* Tinted yes / no cells (a cell that holds a check or a times icon) */
.table tbody td:has(.fa-check-circle.text-success) {
	background: rgba(22, 163, 74, 0.09);
}
.table tbody td:has(.fa-times-circle) {
	background: rgba(239, 68, 68, 0.06);
}
.table tbody td .fa-check-circle.text-success { color: #16a34a !important; }
.table tbody td .fa-times-circle.text-muted { color: #ef4444 !important; opacity: 0.55; }

/* Soften the heavy default borders */
.table.table-bordered > :not(caption) > * > * {
	border-color: #eef1f6;
}
.table tbody tr:hover > * {
	background-color: rgba(37, 99, 235, 0.05);
}