/* CnIndexSidebar — NcAppSidebar wrapper styles */

/* Tab content: limit height to container so overflow shows a scrollbar */
.cn-index-sidebar__tab-content {
	max-height: 100%;
	min-height: 0;
	overflow-y: auto;
}

/* Sidebar header icon (compact mode figure area) */
.cn-index-sidebar__header-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: var(--color-primary-element);
}

.cn-index-sidebar__header-emoji {
	font-size: 28px;
	line-height: 1;
}

/* Search tab sections */
.cn-index-sidebar__section {
	padding: calc(4 * var(--default-grid-baseline));
}

.cn-index-sidebar__section h3 {
	margin: 0 0 calc(3 * var(--default-grid-baseline)) 0;
	font-size: 15px;
	font-weight: 600;
}

.cn-index-sidebar__description {
	color: var(--color-text-maxcontrast);
	font-size: 13px;
	margin: 0 0 calc(4 * var(--default-grid-baseline)) 0;
}

.cn-index-sidebar__filter-group {
	margin-bottom: calc(3 * var(--default-grid-baseline));
}

.cn-index-sidebar__filter-header {
	display: flex;
	align-items: center;
	gap: var(--default-grid-baseline);
	margin-bottom: var(--default-grid-baseline);
}

.cn-index-sidebar__filter-label {
	font-size: 13px;
	font-weight: 500;
	color: var(--color-main-text);
}

.cn-index-sidebar__info-btn {
	min-width: var(--clickable-area-small, 24px) !important;
	min-height: var(--clickable-area-small, 24px) !important;
	width: var(--clickable-area-small, 24px) !important;
	height: var(--clickable-area-small, 24px) !important;
	padding: 0 !important;
	color: var(--color-text-maxcontrast);
}

.cn-index-sidebar__info-btn:hover {
	color: var(--color-primary);
}

.cn-index-sidebar__filter-description {
	padding: calc(2 * var(--default-grid-baseline)) calc(3 * var(--default-grid-baseline));
	max-width: 260px;
	font-size: 13px;
	color: var(--color-main-text);
	margin: 0;
	line-height: var(--default-line-height, 1.4);
}

.cn-index-sidebar__select {
	width: 100%;
}

/* Visually hide NcSelect's rendered label — the filter heading already shows it.
   Keep input-label prop for screen-reader accessibility. */
.cn-index-sidebar__select label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.cn-index-sidebar__empty {
	color: var(--color-text-maxcontrast);
	font-size: 13px;
	font-style: italic;
}

/* ── Columns tab ── */

.cn-sidebar-columns {
	padding: calc(4 * var(--default-grid-baseline));
}

.cn-sidebar-columns h3 {
	margin-top: 0;
	margin-bottom: calc(2 * var(--default-grid-baseline));
	font-size: 18px;
	font-weight: 600;
}

.cn-sidebar-columns__description {
	color: var(--color-text-maxcontrast);
	margin-bottom: calc(4 * var(--default-grid-baseline));
	font-size: var(--default-font-size);
}

/* Collapsible column group card */
.cn-sidebar-columns__group {
	margin-bottom: calc(6 * var(--default-grid-baseline));
}

.cn-sidebar-columns__group h4 {
	margin-top: 0;
	margin-bottom: calc(3 * var(--default-grid-baseline));
	font-size: var(--default-font-size);
	font-weight: 600;
	color: var(--color-text-light);
	border-bottom: 1px solid var(--color-border);
	padding-bottom: calc(2 * var(--default-grid-baseline));
}

.cn-sidebar-columns__group .checkbox-radio-switch {
	margin-bottom: calc(2 * var(--default-grid-baseline));
}

.cn-sidebar-columns__group .checkbox-radio-switch__content {
	padding: var(--default-grid-baseline) 0;
}

.cn-sidebar-columns__group--collapsible {
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius);
	padding: 0;
	margin-bottom: calc(3 * var(--default-grid-baseline));
}

.cn-sidebar-columns__group-header {
	display: flex;
	align-items: center;
	gap: calc(2 * var(--default-grid-baseline));
	padding: calc(3 * var(--default-grid-baseline));
	cursor: pointer;
	user-select: none;
	transition: background-color var(--animation-quick) ease;
}

.cn-sidebar-columns__group-header:hover {
	background-color: var(--color-background-hover);
}

.cn-sidebar-columns__group-header h4 {
	margin: 0;
	padding: 0;
	border: none;
	flex: 1;
	color: var(--color-main-text);
}

.cn-sidebar-columns__select-all {
	margin: 0 !important;
	font-size: 12px;
}

.cn-sidebar-columns__group-content {
	padding: calc(3 * var(--default-grid-baseline));
	border-top: 1px solid var(--color-border);
	display: flex;
	flex-direction: column;
	gap: calc(2 * var(--default-grid-baseline));
}

.cn-sidebar-columns__empty {
	color: var(--color-text-maxcontrast);
	font-size: 13px;
	font-style: italic;
}