/* main.css - 全局样式和基础布局 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    height: 100vh;
    overflow: hidden;
}

/* 结果和错误区域 */
.result-section {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 8px 16px;
    background-color: #e8f5e8;
    border-radius: 4px;
    display: none;
    font-size: 14px;
    z-index: 500;
}

.error {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #ffebee;
    color: #c62828;
    padding: 8px 16px;
    border-radius: 4px;
    margin-top: 5px;
    display: none;
    font-size: 14px;
    z-index: 500;
}

/* 通用样式 */
select, button {
    padding: 6px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
}

button {
    background-color: #4CAF50;
    color: white;
    border: none;
    cursor: pointer;
}

button:hover {
    background-color: #45a049;
}

button.secondary {
    background-color: #2196F3;
}

button.secondary:hover {
    background-color: #0b7dda;
}

/* 复选框样式 */
.checkbox-checked {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 13px;
    height: 13px;
    border: 1px solid #ccc;
    border-radius: 3px;
    position: relative;
    cursor: pointer;
    vertical-align: middle;
    margin-right: 8px;
}

.checkbox-checked:checked {
    background-color: #4CAF50;
    border-color: #4CAF50;
}

.checkbox-checked:checked::after {
    content: '✅';
    position: absolute;
    top: -1px;
    left: -1px;
    font-size: 11px;
}

.checkbox-checked:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2);
}

/* 响应式 */
@media (max-width: 768px) {
    #dialog {
        height: 80px;
    }
    #map {
        height: calc(100vh - 80px);
    }
    .circle-button {
        width: 45px;
        height: 45px;
        font-size: 18px;
    }
}