/* CheckSinco - Modern Menu Styles */

/* ===== MENU PANEL BASE ===== */
.cs-menu-panel {
	border-radius: var(--cs-radius, 8px);
	margin-bottom: 12px;
	overflow: hidden;
	box-shadow: 0 1px 4px rgba(0,0,0,0.1);
}

.cs-menu-header {
	padding: 10px 14px;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #fff;
}

.cs-menu-panel ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cs-menu-panel li {
	list-style: none;
	list-style-image: none;
	height: auto;
	margin: 0;
	padding: 0;
}

.cs-menu-panel li a {
	display: block;
	padding: 9px 14px;
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	border-bottom: 1px solid rgba(255,255,255,0.12);
	transition: background-color 0.15s, padding-left 0.15s;
}

.cs-menu-panel li a:hover {
	padding-left: 20px;
}

.cs-menu-panel li:last-child a {
	border-bottom: none;
}

/* ===== GREEN MENU (Consultas, Localiza, Auto) ===== */
.cs-menu-green .cs-menu-header {
	background: var(--cs-green-dark, #4b722c);
}

.cs-menu-green .cs-menu-body,
.cs-menu-green ul {
	background: var(--cs-green, #74ab46);
}

.cs-menu-green li a:hover {
	background: var(--cs-green-light, #94c565);
}

/* ===== BLUE MENU (Menu Principal) ===== */
.cs-menu-blue .cs-menu-header {
	background: var(--cs-blue-dark, #256c92);
}

.cs-menu-blue .cs-menu-body,
.cs-menu-blue ul {
	background: var(--cs-blue, #458aad);
}

.cs-menu-blue li a:hover {
	background: var(--cs-blue-light, #71acc9);
}

/* ===== ORANGE MENU (Usuario) ===== */
.cs-menu-orange .cs-menu-header {
	background: var(--cs-orange-dark, #c04a00);
}

.cs-menu-orange .cs-menu-body,
.cs-menu-orange ul,
.cs-menu-orange .cs-user-name {
	background: var(--cs-orange, #f05f09);
}

.cs-menu-orange li a:hover {
	background: var(--cs-orange-light, #ee862a);
}

.cs-menu-orange li {
	color: #fff;
	padding: 0;
	line-height: 1.4;
}

.cs-menu-orange li:empty,
.cs-menu-orange table:empty {
	display: none;
}

.cs-menu-orange li.cs-menu-danger a {
	background: #c0392b;
	border-bottom-color: rgba(0,0,0,0.15);
}

.cs-menu-orange li.cs-menu-danger a:hover {
	background: #a93226;
}

/* ===== BOLETO PANEL (topo) ===== */
.cs-menu-boleto .cs-menu-header {
	background: #c0392b;
}

.cs-menu-boleto ul {
	background: #e74c3c;
}

.cs-menu-boleto li a {
	display: block;
	padding: 9px 14px;
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	border-bottom: 1px solid rgba(0,0,0,0.12);
	transition: background-color 0.15s, padding-left 0.15s;
}

.cs-menu-boleto li a:hover {
	background: #d63031;
	padding-left: 20px;
}

.cs-menu-boleto li:last-child a {
	border-bottom: none;
}

.cs-menu-orange b,
.cs-menu-orange strong {
	font-size: 13px;
}

.cs-menu-orange > ul {
	font-size: 13px;
}

.cs-menu-orange > ul > li {
	padding: 6px 14px;
	font-size: 13px;
	border-bottom: 1px solid rgba(255,255,255,0.12);
}

.cs-user-name {
	padding: 10px 14px;
	font-weight: 600;
	font-size: 13px;
	color: #fff;
	border-bottom: 1px solid rgba(255,255,255,0.15);
}

/* ===== WHITE MENU (Login) ===== */
.cs-menu-white {
	background: #fff;
	border: 1px solid #ddd;
}

.cs-menu-white .cs-menu-header {
	background: #666;
}

.cs-menu-white .cs-menu-body,
.cs-menu-white ul {
	background: #fff;
}

.cs-menu-white li a {
	color: #555;
	border-bottom-color: #eee;
}

.cs-menu-white li a:hover {
	background: #f5f5f5;
	padding-left: 20px;
}

/* ===== LOGIN FORM ===== */
.cs-login-panel {
	background: #fff;
	border-radius: var(--cs-radius, 8px);
	margin-bottom: 12px;
	overflow: hidden;
	box-shadow: 0 1px 4px rgba(0,0,0,0.1);
	border: 1px solid #ddd;
}

.cs-login-panel .cs-menu-header {
	background: var(--cs-orange-dark, #c04a00);
	cursor: default;
}

.cs-login-body {
	padding: 16px;
}

.cs-login-body label {
	display: block;
	font-weight: 600;
	font-size: 13px;
	color: #555;
	margin-bottom: 4px;
}

.cs-login-body input[type="text"],
.cs-login-body input[type="password"] {
	width: 100%;
	padding: 8px 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 14px;
	margin-bottom: 12px;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.cs-login-body input[type="text"]:focus,
.cs-login-body input[type="password"]:focus {
	border-color: var(--cs-blue, #458aad);
	outline: none;
	box-shadow: 0 0 0 3px rgba(69,138,173,0.15);
}

.cs-btn-login {
	display: block;
	width: 100%;
	padding: 10px;
	background: var(--cs-blue, #458aad);
	color: #fff;
	border: none;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s;
	text-align: center;
}

.cs-btn-login:hover {
	background: var(--cs-blue-dark, #256c92);
}

/* ===== EXTRA LINKS ===== */
.cs-extra-links {
	border: 1px solid #ddd;
	border-radius: var(--cs-radius, 8px);
	margin-bottom: 12px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}

.cs-extra-links ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cs-extra-links li {
	list-style: none;
	list-style-image: none;
	height: auto;
	margin: 0;
	padding: 0;
}

.cs-extra-links li a {
	display: block;
	padding: 9px 14px;
	color: #555;
	text-decoration: none;
	font-size: 13px;
	border-bottom: 1px solid #eee;
	transition: background 0.15s, padding-left 0.15s;
}

.cs-extra-links li a:hover {
	background: #f5f5f5;
	padding-left: 20px;
}

.cs-extra-links li:last-child a {
	border-bottom: none;
}

/* ===== PREPAGO INFO ===== */
.cs-prepago-info {
	background: #fff;
	border: 1px solid #ddd;
	border-radius: var(--cs-radius, 8px);
	margin-bottom: 12px;
	padding: 14px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}

.cs-prepago-info strong {
	font-size: 13px;
	color: #333;
}

.cs-saldo-value {
	color: #dc3545;
	font-weight: 700;
	font-size: 16px;
}

.cs-saldo-label {
	font-size: 12px;
	color: #666;
	margin-bottom: 2px;
}

/* ===== TOOLTIP (legacy) ===== */
a.tooltip {
	position: relative;
	color: #039;
	text-decoration: none;
	z-index: 24;
}

a.tooltip:hover { z-index: 25; }
a.tooltip span { display: none; }

a.tooltip:hover span {
	display: block;
	position: absolute;
	width: 230px;
	top: 0;
	text-align: justify;
	left: 100%;
	margin-left: 8px;
	font-size: 12px;
	padding: 8px 12px;
	border: 1px solid #999;
	background: #E6FFBF;
	color: #000;
	border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.15);
	z-index: 100;
}

/* ===== RESPONSIVE MENUS ===== */
@media (max-width: 991.98px) {
	.cs-menu-panel,
	.cs-login-panel,
	.cs-extra-links,
	.cs-prepago-info {
		margin-bottom: 10px;
	}
}