body{
	background:#f8f9fa;
	overflow: auto;
	font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

html, body{
	height: 100%;
	max-width: 100%;
	overflow-x: hidden;
}

/* Cards resumen (más compactas) */
.card-resumen{
	border:none;
	border-radius:.75rem;
	color:#fff;
	padding:.7rem .8rem;
	height:100%;
}

.card-resumen .icon{
	font-size:1.5rem;
	opacity:.9;
}

.card-resumen .value{
	font-size:1.2rem;
	font-weight:700;
	line-height:1.1;
}

.card-resumen small{
	opacity:.9;
}

/* Cards alerta */
.card-alerta{
	border:none;
	border-radius:.75rem;
	padding:.8rem .9rem;
	color:#fff;
	height:100%;
}

.card-resumen .icon{
	font-size:1.5rem;
	opacity:.9;
}


/* Cards menú */
.card-menu{
	border:none;
	border-radius:.75rem;
	padding:1.1rem .9rem;
	background:#fff;
	text-align:center;
	box-shadow:0 4px 10px rgba(0,0,0,.06);
	transition:.2s;
	height:100%;
	cursor:pointer;
}

.card-menu:hover{
	transform:translateY(-2px);
	box-shadow:0 6px 14px rgba(0,0,0,.1);
}

.card-menu .icon{
	font-size:1.9rem;
	margin-bottom:.25rem;
}

.card-menu .title{
	font-weight:600;
	font-size:.9rem;
}

/* Header fijo */
.app-header{
	position: sticky;
	background:#fff;
	border-bottom:1px solid #dee2e6;
	padding:.75rem 1rem;
	display:flex;
	align-items:center;
	justify-content:space-between;
	top:0;
	z-index: 1030; /* arriba de cards y tablas */
}

/* Contenedor principal */
#appContent{
	padding:1rem;
}

/* Loader simple */
.loader{
	display:flex;
	justify-content:center;
	align-items:center;
	height:60vh;
	font-size:1.2rem;
	color:#6c757d;
}

/* ===== BADGES UBICACIÓN ===== */

.badge-publicidad,
.badge-recomendacion,
.badge-mkt,
.badge-na{
	font-size:.75rem;
	padding:.35em .6em;
	border-radius:.4rem;
}


.badge-publicidad{
	background-color:#6f42c1; /* morado */
	color:#fff;
}

.badge-recomendacion{
	background-color:#6c757d; /* gris */
	color:#fff;
}

.badge-mkt{
	background-color:#0d6efd; /* azul bootstrap */
	color:#fff;
}

.badge-na{
	background-color:#adb5bd; /* gris claro */
	color:#212529;
}


/* ===== TABLAS RESPONSIVE ===== */

.table-scroll{
	overflow-x:auto;
	-webkit-overflow-scrolling:auto; /* smooth iOS */
}

.table-scroll table{
	/*min-width:650px; /* ajusta según columnas */*/
}

.table-scroll-pendientes table{
	min-width:650px; /* ajusta según columnas */
}

.table-scroll-ventas table{
	min-width:650px; /* ajusta según columnas */
}

.table-scroll::after{
	content:'⇆ Desliza';
	font-size:.65rem;
	color:#6c757d;
	display:block;
	text-align:right;
	padding:.25rem .5rem;
}

.table-scroll-clientes {
	overflow-x: scroll;
	overflow-y: auto;
	/*-webkit-overflow-scrolling: auto;*/
	max-height: 75vh; /* más aire */
}

:is(.table-scroll-clientes, .table-scroll-gasolina, .table-scroll-publicidad
) th,
:is(.table-scroll-clientes, .table-scroll-gasolina, .table-scroll-publicidad
) td { 
	white-space: nowrap !important;
}


/*.table-scroll-clientes th,
.table-scroll-clientes td {
	white-space: nowrap !important;
}

.table-scroll-gasolina th,
.table-scroll-gasolina td {
	white-space: nowrap !important;
}

.table-scroll-publicidad th,
.table-scroll-publicidad td {
	white-space: nowrap !important;
}*/



/*.ventas-badges{
	display: flex;
	gap: .4rem;
	overflow-x: auto;
	white-space: nowrap;
	max-width: 100%;
	-webkit-overflow-scrolling: touch;
	width: 100%;
	justify-content: flex-start;
}

.ventas-badges .badge{
	flex-shrink: 0;
}


.ventas-badges{
	scroll-snap-type: x mandatory;
}

.ventas-badges .badge{
	scroll-snap-align: start;
}*/

.ventas-badges{
	display: flex;
	gap: .4rem;
	overflow-x: auto;
	white-space: nowrap;
	width: 100%;
	scroll-snap-type: x mandatory;
}

.ventas-badges .badge{
	flex-shrink: 0;
	scroll-snap-align: start;
}

@media (min-width: 768px){
	.ventas-badges{
		overflow-x: visible;
	}
	.ventas-badges .badge{
		flex: 1 1 auto;
		text-align: center;
	}
}

/* Quitar scroll feo en iOS */
.ventas-badges::-webkit-scrollbar{
	display:none;
}

.toast-success {
	border-left: 8px solid #198754 !important;
	background: #f6fffa;
}

.toast-info {
	border-left: 8px solid #0dcaf0 !important;
	background: #f1fbfe;
}

.toast-warning {
	border-left: 8px solid #ffc107 !important;
	background: #fff9e6;
}

.toast-danger {
	border-left: 8px solid #dc3545 !important;
	background: #fff5f5;
}

.table-fixed{
	table-layout: fixed;
	width: 100%;
}

.reporte-subfila {
	font-size: 0.88rem;
	color: #555;
}

/* =========================
   CONTENEDOR GENERAL
========================= */
.calendar-wrapper{
	background:#fff;
	border-radius:.6rem;
	padding:1rem;
}

/* =========================
   RESUMEN SUPERIOR
========================= */
.calendar-resumen{
	background:#212529;
	color:#fff;
	border-radius:.6rem;
}

.calendar-resumen strong{
	color:#fff;
}

.calendar-resumen div{
	min-width:150px;
}

/* =========================
   GRID
========================= */
.calendar-grid{
	display:grid;
	grid-template-columns: repeat(7,1fr);
	gap:8px;
	margin-top:.5rem;
}

/* =========================
   ENCABEZADO DÍAS
========================= */
.calendar-header{
	background:#212529;
	color:#fff;
	text-align:center;
	font-weight:600;
	font-size:.75rem;
	padding:.5rem 0;
	border-radius:.4rem;
}

/* =========================
   DÍA NORMAL
========================= */
.calendar-day{
	background:#f8f9fa;
	border:1px solid #dee2e6;
	border-radius:.6rem;
	padding:.6rem;
	min-height:110px;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	font-size:.75rem;
	transition:all .15s ease-in-out;
}

.calendar-day:hover{
	box-shadow:0 3px 8px rgba(0,0,0,.08);
	transform:translateY(-1px);
}

.calendar-day.empty{
	background:#f1f3f5;
}

/* =========================
   NÚMERO DEL DÍA
========================= */
.calendar-day-number{
	font-weight:600;
	font-size:.85rem;
	color:#212529;
}

/* =========================
   MÉTRICAS
========================= */
.calendar-stats{
	display:flex;
	flex-direction:column;
	gap:3px;
}

.stat-money{
	font-weight:700;
	font-size:.85rem;
	color:#212529;
}

.stat-compact{
	font-weight:600;
	font-size:.75rem;
	color:#495057;
}

/* =========================
   MEJOR DÍA DEL MES
========================= */
.calendar-day.best-day{
	background:#e9f7ef;
	border:2px solid #198754;
}

/* =====================================
   RESPONSIVE CALENDARIO – MOBILE
===================================== */
@media (max-width:576px){

	/* ===== RESUMEN SUPERIOR ===== */
	.calendar-resumen{
		padding:.5rem .75rem !important;
	}

	.calendar-resumen div{
		min-width:auto;
		font-size:.7rem;
	}

	/* ===== GRID ===== */
	.calendar-grid{
		gap:5px;
	}

	/* ===== ENCABEZADO DÍAS ===== */
	.calendar-header{
		font-size:0;              /* ocultamos texto original */
		padding:.3rem 0;
		border-radius:.3rem;
		position:relative;
	}

	/* Abreviaturas móviles */
	.calendar-header:nth-child(1)::after{ content:"D"; font-size:.65rem; }
	.calendar-header:nth-child(2)::after{ content:"L"; font-size:.65rem; }
	.calendar-header:nth-child(3)::after{ content:"M"; font-size:.65rem; }
	.calendar-header:nth-child(4)::after{ content:"M"; font-size:.65rem; }
	.calendar-header:nth-child(5)::after{ content:"J"; font-size:.65rem; }
	.calendar-header:nth-child(6)::after{ content:"V"; font-size:.65rem; }
	.calendar-header:nth-child(7)::after{ content:"S"; font-size:.65rem; }

	.calendar-header::after{
		color:#fff;
		font-weight:600;
	}

	/* ===== DÍAS ===== */
	.calendar-day{
		min-height:72px;
		padding:.35rem;
		border-radius:.45rem;
	}

	.calendar-day-number{
		font-size:.7rem;
	}

	.stat-money{
		font-size:.7rem;
		font-weight:600;
	}

	.stat-compact{
		font-size:.6rem;
	}

	/* Mejor día mantiene presencia */
	.calendar-day.best-day{
		border-width:2px;
	}

	/* Días sin actividad más sutiles */
	.calendar-day.day-disabled{
		opacity:.75;
	}

	.calendar-scroll{
		overflow-x:auto;
		-webkit-overflow-scrolling:touch;
	}

	.calendar-grid{
		min-width:720px; /* 7 días × ~100px cada uno */
	}
}

/* =========================
   DÍA SIN ACTIVIDAD
========================= */
.calendar-day.day-disabled{
	background:#f1f3f5;
	border:1px dashed #dee2e6;
	color:#adb5bd;
	cursor:default;
}

.calendar-day.day-disabled:hover{
	box-shadow:none;
	transform:none;
}