/* ✅ 기본 폰트 및 배경 설정 */
body {
    font-family: 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif;
    background-color: #f9f9f9;
    margin: 0;
    padding: 0;
    color: #333;
}

/* ✅ 전체 레이아웃 박스 여백 */
.container {
    max-width: 1200px;
    margin: auto;
    padding: 20px;
}

/* ✅ 상단 탑바 스타일 */
header, .topbar {
    background-color: #003366;
    color: white;
    padding: 15px;
    font-size: 18px;
}

.topbar a {
    color: white;
    text-decoration: none;
    margin-right: 20px;
}

.topbar a:hover {
    text-decoration: underline;
}

/* ✅ 제목 스타일 */
h1, h2, h3 {
    color: #222;
    margin-top: 20px;
}

/* ✅ 버튼 공통 스타일 */
button, input[type="submit"] {
    background-color: #007acc;
    color: white;
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

button:hover, input[type="submit"]:hover {
    background-color: #005b99;
}

/* ✅ 상품 카드 레이아웃 */
.product-card {
    border: 1px solid #ccc;
    background-color: white;
    padding: 15px;
    width: 220px;
    text-align: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
    border-radius: 8px;
    float: left;
}

.product-card img {
    width: 200px;
    height: auto;
    margin-bottom: 10px;
}

/* ✅ 푸터 스타일 */
footer {
    background-color: #e0e0e0;
    padding: 20px;
    text-align: center;
    font-size: 12px;
    color: #555;
}

/* ✅ 폼 입력 박스 스타일 */
input[type="text"], input[type="password"], input[type="email"], select {
    padding: 8px;
    width: 250px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* ✅ 장바구니/주문 목록 리스트 스타일 */
ul {
    list-style-type: disc;
    padding-left: 30px;
}

/* ✅ 테이블 스타일 */
table {
    border-collapse: collapse;
    width: 100%;
    margin-top: 20px;
}

th, td {
    border: 1px solid #ccc;
    padding: 10px;
    text-align: left;
}

th {
    background-color: #f0f0f0;
}