body{
font-family:Noto Sans Devanagari,Arial,sans-serif;
background:#f5f5f5;
margin:0;padding:0;
}
.top-bar, .top-bar-1{
/*background:#eaeaea;*/
padding:12px;
font-size:18px;
font-weight:bold;
text-align:center;
height: 30px;
width: 100%;
}
.content-wrapper{
	width:90%;
	max-width:520px;
	margin:0 auto;
	text-align: center;
}
.top-bar-1 {height: 0px!important;}
.bg-orange, .bg-green{
	background:#ff8a44;
	border-radius:18px;
	padding:1px;
	box-shadow:0 4px 8px rgba(0,0,0,.2);
	text-align: center;
	font-size: 15px;
	font-weight: 500;
}
.bg-green{background: #cddc39!important;}
#machineTitle{
text-align:center;
font-size:20px;
margin:10px 0;
font-weight:bold;
}
.evm{
width:90%;
max-width:520px;
margin:0 auto;
background:#dcdcdc;
border-radius:18px;
padding:12px;
box-shadow:0 4px 8px rgba(0,0,0,.2);
}
table{
width:100%;
border-collapse:collapse;
background:#fff;
border-radius:12px;
overflow:hidden;
}
thead{
background:#e6e6e6;
}
th,td{
padding:12px;
border-bottom:1px solid #ccc;
text-align:center;
font-size:16px;
}

.top-candidates thead {background:#cddc39;}
.top-candidates th,td {
	padding:5px;
}
.symbol{
font-size:22px;
}
.btn-col{
background:#f2f2f2;
}
.vote-btn{
background:#0a2f8f;
color:#fff;
border:none;
border-radius:22px;
padding:6px 22px;
font-size:14px;
cursor:pointer;
}
.vote-btn:disabled{
opacity:.4;
cursor:not-allowed;
}
.arrow{
display: inline-block;
color:#d32f2f;
font-size:20px;
margin-right:6px;
}
.photo img{
	width: 35px;
}

.arrowKey {animation: slide 1.5s ease-in-out infinite;}
@keyframes slide {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(10px); }
}
.swipe{
animation:swipe 0.8s forwards;
}
@keyframes swipe{
0%{transform:translateX(0);opacity:1}
100%{transform:translateX(-100%);opacity:0}
}

/* Zoom animation for first 3 rows only */
.zoom-row {
  opacity: 0;
  transform: scale(0.3);
  animation: zoomEffect 2s ease-in-out forwards;
}

/* Stagger the animation for each row */
.zoom-row:nth-child(1) {
  animation-delay: 0.2s;
}

.zoom-row:nth-child(2) {
  animation-delay: 0.4s;
}

.zoom-row:nth-child(3) {
  animation-delay: 0.6s;
}

/* Keyframes for zoom in and out effect */
@keyframes zoomEffect {
  0% {
    opacity: 0;
    transform: scale(0.3);
  }
  50% {
    opacity: 1;
    transform: scale(1.1);
  }
  70% {
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/* Optional: Add some styling to make the effect more visible */
.zoom-row td {
  /*background-color: #f8f9fa;*/
  transition: background-color 0.3s;
}

/* If you want the entire row to be highlighted during animation */
.zoom-row {
  background-color: rgba(248, 249, 250, 0.8);
  border-left: 4px solid #4CAF50;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.rowPink {background-color: #f7caea;}
.rowYellow {background-color: #f0e47f;}
.rowBlue {background-color: #8fd9fbe3;}
.candidateText span { font-weight: 700; }
