/**
 * Avatech Tag Block
 *
 * @author    Avatech
 * @copyright Avatech
 * @license   Proprietary - https://avatech.ro
 *
 * Everything is scoped under #avtagblock to avoid clashing with the theme.
 * Colours / sizes / alignment are driven by inline styles + CSS variables
 * set from the admin settings, so this file only handles layout.
 */

#avtagblock.avtagblock {
    width: 100%;
    padding: 0;
    box-sizing: border-box;
}

#avtagblock .avtagblock-inner {
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}

#avtagblock .avtagblock-title {
    margin: 0 0 14px 0;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
}

#avtagblock .avtagblock-list {
    margin: 0;
    padding: 0;
    list-style: none;
    line-height: 1.7;
}

#avtagblock .avtagblock-item {
    display: inline;
}

/* Separator between tags, configurable via the --avtag-sep variable. */
#avtagblock .avtagblock-item:not(:last-child)::after {
    content: var(--avtag-sep, '| ');
    color: var(--avtag-color, inherit);
    opacity: 0.55;
    margin: 0 6px 0 4px;
    white-space: nowrap;
}

#avtagblock .avtagblock-item a {
    color: var(--avtag-color, inherit);
    font-size: var(--avtag-size, 14px);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s ease, opacity 0.15s ease;
}

#avtagblock .avtagblock-item a:hover,
#avtagblock .avtagblock-item a:focus {
    color: var(--avtag-hover, var(--avtag-color, inherit));
    text-decoration: underline;
}

/* Some themes add ::before bullets on footer links - neutralise them here. */
#avtagblock .avtagblock-item a::before {
    content: none !important;
}

@media (max-width: 767px) {
    #avtagblock .avtagblock-list {
        line-height: 2.3;
    }
}