/* 
Created by Sean L. on May. 17.
Last Updated by Sean L. on May. 17.

ZKE Dictionary
public/css/main.css

Makabak1880, 2025. All rights reserved.
*/

@import url('https://fonts.cdnfonts.com/css/noto-serif');
@import url('https://fonts.cdnfonts.com/css/noto-serif-tc');
@import url(./list.css);
@import url(./palette.css);
@import url(./sidebar.css);
@import url(./modal.css);

body {
	font-family: 'Noto Serif SC', 'Noto Serif', 'Times New Roman', sans-serif;
}

/* h1 {
	font-size: 2.5em;
} */

main, header {
	margin: 100px;
}

header {
	margin-left: 0;
}

ul {
	margin: 0;
	padding: 0;
}

button {
	border: none;
	background: none;
	color: var(--accent-dark);
}

button:hover {
	cursor: pointer;
	color: var(--accent-light);
	transition: color 0.3s ease-in-out;
}

button:disabled {
	color: #aaa;
}

div#pagination-controls {
	display: flex;
	justify-content: stretch;
	align-items: center;
}

button, input {
	font: 'Noto Serif SC', 'Noto Serif', 'Times New Roman', sans-serif;
}

input#page-number {
	border: none;
	background: none;
	width: 3em;
}

input#page-number:focus {
	outline: none;
}

input#page-number:disabled {
	border: none;
	background: none;
}

a, #search-btn {
	text-decoration: none;
	color: var(--accent-dark);
	transition: color 0.3s ease-in-out;
}

a:hover {
	text-decoration: underline;
	color: var(--accent-light);
}

#search-btn:hover {
	cursor: pointer;
	color: var(--accent-light);
}

@media (max-width: 768px) {
    main,
    header {
        margin-left: 20px;
		margin-right: 20px;
    }

    header {
        margin-left: 0;
		margin-top: 100px;
    }

    input#page-number {
        width: 2.5em;
    }
}

footer {
	opacity: 50%;
	margin-top: 50px;
}
ins {
	text-decoration: none;
}