/* Adicional Hashtags: chips da loja (ficha e /tag/) e campo do cadastro de produto */

.hashtags-produto {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .4rem;
}

.hashtags-produto .hashtags-chip {
	padding: .15rem .65rem;
	font-size: .8rem;
}

.hashtags-grade {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .75rem;
}

.hashtags-chip {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .3rem .8rem;
	border: 1px solid #e5e7eb;
	border-radius: 9999px;
	background: #fff;
	color: var(--theme-accent-dark, var(--theme-accent, #1f2937));
	font-size: .875rem;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	transition: border-color .15s, background-color .15s, color .15s;
}

.hashtags-chip:hover,
.hashtags-chip:focus-visible {
	border-color: var(--theme-accent, #2563eb);
	background: var(--theme-accent, #2563eb);
	color: var(--theme-accent-text, #fff);
}

.hashtags-chip--grande {
	padding: .5rem 1.1rem;
	font-size: 1rem;
}

.hashtags-chip__total {
	min-width: 1.5rem;
	padding: 0 .4rem;
	border-radius: 9999px;
	background: rgba(0, 0, 0, .06);
	font-size: .75rem;
	font-weight: 600;
	text-align: center;
}

.hashtags-vazio {
	color: #6b7280;
	text-align: center;
}

/* Admin: campo em chips */
.hashtags-campo__caixa {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .35rem;
	min-height: calc(1.5em + .75rem + 2px);
	height: auto;
	cursor: text;
}

.hashtags-campo__chip {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	padding: .1rem .2rem .1rem .55rem;
	border-radius: 9999px;
	background: #e7f1ff;
	color: #0b5ed7;
	font-size: .85rem;
	font-weight: 600;
}

/* Seletores dobrados: os estilos globais de button/input do admin vencem a classe simples */
.hashtags-campo .hashtags-campo__remover {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 1.1rem;
	min-width: 0;
	height: 1.1rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 9999px;
	background: transparent;
	box-shadow: none;
	color: inherit;
	font-size: .95rem;
	line-height: 1;
	cursor: pointer;
	appearance: none;
}

.hashtags-campo .hashtags-campo__remover:hover,
.hashtags-campo .hashtags-campo__remover:focus-visible {
	background: rgba(11, 94, 215, .15);
}

.hashtags-campo .hashtags-campo__entrada {
	flex: 1 1 8rem;
	min-width: 8rem;
	height: auto;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	outline: 0;
	background: transparent;
	box-shadow: none;
	color: inherit;
}

.hashtags-campo__existentes {
	margin-top: .5rem;
}

.hashtags-campo__existentes summary {
	display: inline-block;
	color: #0b5ed7;
	font-size: .875rem;
	cursor: pointer;
}

.hashtags-campo__filtro {
	max-width: 16rem;
	margin-top: .5rem;
}

.hashtags-campo__opcoes {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	max-height: 12rem;
	margin-top: .5rem;
	padding: .5rem;
	overflow-y: auto;
	border: 1px solid #dee2e6;
	border-radius: .375rem;
	background: #f8f9fa;
}

.hashtags-campo__opcao {
	padding: .15rem .6rem;
	border: 1px solid #ced4da;
	border-radius: 9999px;
	background: #fff;
	color: #212529;
	font-size: .85rem;
	cursor: pointer;
}

.hashtags-campo__opcao:hover,
.hashtags-campo__opcao:focus-visible {
	border-color: #0b5ed7;
	color: #0b5ed7;
}

.hashtags-campo__opcao[aria-pressed="true"] {
	border-color: #0b5ed7;
	background: #e7f1ff;
	color: #0b5ed7;
	font-weight: 600;
}

/* Tela do adicional: lista de produtos da hashtag */
.hashtags-produtos-vazio {
	padding: 2rem 1rem;
	border: 2px dashed #dee2e6;
	border-radius: .5rem;
	color: #6c757d;
	text-align: center;
}

.hashtags-produtos-foto {
	width: 48px;
	height: 48px;
	border-radius: .375rem;
	background: #f8f9fa;
	object-fit: contain;
}

/* Loja: páginas e notícias vinculadas à hashtag */
.hashtags-conteudos {
	max-width: 96rem;
	margin: 0 auto 2.5rem;
}

.hashtags-conteudos__titulo {
	margin: 0 0 1rem;
	color: #111827;
	font-size: 1.25rem;
	font-weight: 700;
}

.hashtags-conteudos__grade {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
	gap: 1rem;
}

.hashtags-conteudo {
	display: flex;
	flex-direction: column;
	gap: .4rem;
	padding: 1.1rem 1.25rem;
	border: 1px solid #e5e7eb;
	border-radius: .75rem;
	background: #fff;
	color: #374151;
	text-decoration: none;
	transition: border-color .15s, box-shadow .15s;
}

.hashtags-conteudo:hover,
.hashtags-conteudo:focus-visible {
	border-color: var(--theme-accent, #2563eb);
	box-shadow: 0 4px 14px rgba(0, 0, 0, .06);
}

.hashtags-conteudo__tipo {
	color: var(--theme-accent-dark, var(--theme-accent, #2563eb));
	font-size: .75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .03em;
}

.hashtags-conteudo__titulo {
	color: #111827;
	font-size: 1rem;
	line-height: 1.35;
}

.hashtags-conteudo__resumo {
	color: #6b7280;
	font-size: .875rem;
	line-height: 1.5;
}