border: 1px solid #bee5eb;
border-radius: 6px;
padding: 15px;
margin-bottom: 20px;
text-align: center;
}
.pagination-controls {
display: flex;
justify-content: center;
gap: 10px;
margin: 20px 0;
flex-wrap: wrap;
}
.pagination-controls button {
background: #e67e22;
color: white;
border: none;
padding: 8px 16px;
border-radius: 4px;
cursor: pointer;
font-size: 0.9em;
}
.pagination-controls button:hover {
background: #d35400;
}
.pagination-controls button:disabled {
background: #bdc3c7;
cursor: not-allowed;
}
.load-all-button {
background: #27ae60 !important;
margin-left: 20px;
}
.load-all-button:hover {
background: #229954 !important;
}
.error {
text-align: center;
padding: 40px;
color: #e74c3c;
background: #fdf2f2;
border-radius: 6px;
}
.feed-url {
background: #ecf0f1;
padding: 10px;
border-radius: 4px;
font-family: monospace;
word-break: break-all;
margin-bottom: 20px;
}
/* Responsive design for mobile */
@media (max-width: 600px) {
.rss-container {
margin: 10px;
padding: 15px;
}
.episode {
flex-direction: column;
gap: 10px;
}
.episode-artwork {
width: 80px;
height: 80px;
align-self: center;
}
.episode-title {
font-size: 1em;
}
}