/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */



/* Style for the table */
.wp-block-coinpaprika-block {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    font-family: Arial, sans-serif;
}

/* Style for table headers */
.wp-block-coinpaprika-block th {
    // background-color: #f2f2f2;
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}

/* Style for table cells */
.wp-block-coinpaprika-block td {
    padding: 12px;
    // border-bottom: 1px solid #ddd;
}
.wp-block-coinpaprika-block td img{
   width: 24px;
}
.wp-block-coinpaprika-block td.logo-name {
    display: flex;
    align-items: center;
}
/* Alternating row background color */
// .wp-block-coinpaprika-block tbody tr:nth-child(even) {
//     background-color: #f9f9f9;
// }

/* Hover effect on rows */
// .wp-block-coinpaprika-block tbody tr:hover {
//     background-color: #e9ecef;
// }


/* Responsive table styles */
@media screen and (max-width: 600px) {
    .wp-block-coinpaprika-block {
        overflow-x: auto;
        display: block;
    }
}





/*Label style start */
.wp-block-coinpaprika-block  .coin-container {
    // background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;

}

.wp-block-coinpaprika-block .coin-stats img{
    width: 24px;
 }
.wp-block-coinpaprika-block  .coin-stats {
    // background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 10px;
    display: flex;
    justify-content: space-between;
}

.wp-block-coinpaprika-block  span.label,.wp-block-coinpaprika-block span.value {
    display: flex;
    align-items: center;
}




/*Label style end */


/*Ticker style start*/
// .wp-block-coinpaprika-block .ticker-wrapper .ticker p .label img{
//     width: 24px;
//  }
.wp-block-coinpaprika-block .ticker-wrapper {
    overflow: hidden;
    // background: #333;
    // color: #fff;
    padding: 10px 0;
    position: relative;
    width: 100%;
}

.wp-block-coinpaprika-block .ticker {
    display: flex;
    width: 200%;
    // animation: ticker 50s linear infinite;
}
.wp-block-coinpaprika-block .ticker-content {
    display: flex;
    width: 100%;
}

.wp-block-coinpaprika-block .ticker p {
    white-space: nowrap; /* Prevent line breaks */
    margin: 0; /* Remove default margin */
    padding: 0 1em; /* Space between items */
    display: flex; /* Ensure items are displayed in a row */
    align-items: center; /* Vertically align items */
    flex-shrink: 0; /* Prevent shrinking which could cause overlap */
}

@keyframes ticker {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}
/* Pause the animation on hover */
// .wp-block-coinpaprika-block .ticker-wrapper:hover{
//     animation-play-state: paused;
// }

/* Additional styling for labels and values */
.wp-block-coinpaprika-block .label {
    display: inline-flex;
    align-items: center;
    margin-right: 1em; /* Adjust spacing between label and value as needed */
}

.wp-block-coinpaprika-block .label img {
    width: 20px; /* Adjust size as needed */
    height: auto;
    margin-right: 5px;
}
/*Ticker style end*/