.tm-poll-wrapper {
max-width: 480px;
margin: 1.5em auto;
padding: 1.2em;
border-radius: 14px;
background: #fff;
box-shadow: 0 2px 10px rgba(0,0,0,0.06);
text-align: center;
font-family: system-ui, sans-serif;
}
.tm-poll-question {
font-size: 1.2em;
font-weight: 600;
margin-bottom: 1em;
color: #111;
}
.tm-poll-buttons {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 0.5em;
margin-bottom: 1em;
}
.tm-poll-btn {
background: #000;
color: #fff;
border: none;
padding: 0.6em 1.2em;
border-radius: 999px;
cursor: pointer;
font-size: 0.95em;
transition: all 0.2s ease;
}
.tm-poll-btn:hover:not(.disabled):not(.voted) {
background: #333;
}
.tm-poll-btn.disabled {
opacity: 0.6;
cursor: not-allowed;
}
.tm-poll-btn.voted {
background: #007b55;
}
.tm-poll-result {
margin-top: 0.8em;
text-align: center;
}
.tm-poll-bar {
width: 100%;
height: 8px;
background: #eee;
border-radius: 5px;
overflow: hidden;
margin-bottom: 0.4em;
}
.tm-poll-bar-fill {
height: 100%;
width: 0%;
background: #007b55;
border-radius: 5px;
transition: width 0.6s ease;
}
.tm-poll-count {
font-size: 0.9em;
color: #555;
}
.tm-poll-note {
margin-top: 0.8em;
font-size: 0.8em;
color: #888;
} .tm-poll-container {
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
gap: 20px;
margin: 1em auto;
max-width: 900px;
} @media (max-width: 700px) {
.tm-poll-container {
flex-direction: column;
align-items: center;
}
.tm-poll-wrapper {
width: 90%;
}
}