/* =========================
   DT Global Visits Widget
   ========================= */

/* Variables fallback */
:root {
/*	--dt-font-size: var(--the7-widget-content-font-size, 12px); 
	--dt-font-color: var(--the7-widget-footer-color, #333); 
	--dt-font-weight: var(--the7-widget-font-weight, 300); 
	--dt-padding-v: var(--the7-widget-footer-padding, 15px);
*/
    --dt-font-size: 12px; 
	--dt-font-color: #333; 
	--dt-font-weight: 300; 
	--dt-padding-v: 15px;
}

/* Contenedor general del contador */
.dt-global-visits { 
    margin: 12px 0;
	font-size: var(--dt-font-size);
	color: var(--dt-font-color);
	font-weight: var(--dt-font-weight);
	padding: calc(var(--dt-padding-v) / 2) calc(var(--dt-padding-v) * 1.2);
	display: inline-block;
	line-height: 1.4;
}


/* -------------------------
   Estilos principales
   ------------------------- */

/* Default */
.dt-global-visits.default {
	background-color: #f5f5f5;
	border: 1px solid #e0e0e0;
	border-radius: 0;
	box-shadow: none;
}

/* Classic */
.dt-global-visits.classic {
	background-color: #ffffff;
	border: 1px solid #dcdcdc;
	border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

/* Rounded */
.dt-global-visits.rounded {
	background-color: #e0f7fa;
	border: 1px solid #b2ebf2;
	border-radius: 12px;
	box-shadow: none;
}

/* Flat */
.dt-global-visits.flat {
	background-color: #eeeeee;
	border: 1px solid #cccccc;
	border-radius: 0;
	box-shadow: none;
}

/* Outline */
.dt-global-visits.outline {
	background-color: transparent;
	border: 1px solid #999999;
	border-radius: 0;
	box-shadow: none;
}


/* -------------------------
   Alineaciones
   ------------------------- */

.dt-global-visits.align-left {
	text-align: left;
}

.dt-global-visits.align-center {
	text-align: center;
}

.dt-global-visits.align-right {
	text-align: right;
}

/* Alineaciones */
.dt-align-left   { text-align: left; }
.dt-align-center { text-align: center; }
.dt-align-right  { text-align: right; }


/* -------------------------
   Extras para móviles y responsivo
   ------------------------- */

/* Media query para pantallas pequeñas */
@media (max-width: 768px) {
	.dt-global-visits {
		font-size: calc(var(--dt-font-size) * 0.9); /* proporcional */
		padding: calc((var(--dt-padding-v) / 2) * 0.8) calc((var(--dt-padding-v) * 1.2) * 0.8);
	}
}
