.kodo-diary-list {
	overflow-y: auto;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.diary-month {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.diary-month__header {
	position: sticky;
	top: 0;
	background: rgba(249, 250, 251, 0.95);
	padding: 8px 0;
	backdrop-filter: blur(6px);
}

.diary-month__header h2 {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #6b7280;
	font-weight: 700;
}



.diary-btn {
	border: none;
	cursor: pointer;
	font-size: 14px;
	border-radius: 12px;
	padding: 8px 12px;
}

.diary-btn--ai {
	background-color: rgb(255 251 235 / var(--tw-bg-opacity, 1));
	color: rgb(217 119 6 / var(--tw-text-opacity, 1));
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	text-decoration: none;
}
.diary-btn--ai svg{
	width: 1.25rem;
	height: 1.25rem;
	display: block;
}
.diary-btn--ai:hover{
	background-color: rgb(254 243 199 / var(--tw-bg-opacity, 1));
}

.diary-actions {
    display: flex;
    gap: 6px;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.diary-btn-holder{
	display: block;
}

.diary-btn--icon {
	background: transparent;
	color: rgb(156 163 175 / var(--tw-text-opacity, 1));
	padding: 0.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.diary-btn--icon svg{
	width: 1.25rem;
	height: 1.25rem;
	display: block;
}

.diary-btn--icon:hover {
	color: #d97706;
	background: #fef3c7;
}

.diary-load-more {
	display: flex;
	justify-content: center;
	padding: 16px 0;
}

.diary-load-more .diary-load-more-button {
	padding: 10px 16px;
	border-radius: 999px;
	border: 1px solid #e5e7eb;
	background: white;
	cursor: pointer;
	text-decoration: none;
	color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}
.diary-load-more .diary-load-more-button:hover {
	color: rgb(17 24 39 / var(--tw-text-opacity, 1));
	background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}