/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */



.ss-category-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ss-category-list li {
    margin-bottom: 10px;
}

.ss-category-list a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    padding: 10px 14px;
    border-radius: 8px;
    background: #f7f7f7;
	color: black;
    transition: background 0.2s ease;
}

.ss-category-list a:hover {
    background: #ececec;
}

.ss-category-list .cat-name {
    font-weight: 500;
}

.ss-category-list .cat-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #eb0000; /* change colour here */
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}


.ss-tag-list-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 8px; /* Space between pills */
    margin-top: 20px; /* Adjust as needed */
}

.ss-tag-pill {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 20px; /* Pill shape */
    background: #f7f7f7; /* Light grey background */
    color: #fff;
    font-size: 14px;
    transition: background 0.2s ease, color 0.2s ease;
}

.ss-tag-pill:hover {
    background: #d0d0d0;
    color: #000;
}

.ss-tag-pill .tag-name {
    margin-right: 6px;
    font-weight: 500;
	color: black;
}

.ss-tag-pill .tag-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px; /* Ensure consistent size for count */
    height: 24px;
    padding: 0 6px; /* Add horizontal padding for numbers > 9 */
    border-radius: 12px; /* Half of height for pill-like count */
    background: #eb0000; /* WordPress blue, change as desired */
    color: #fff;
    font-size: 12px;
    font-weight: 600;
}