/* css/base.css */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

button {
    outline: none;
}

:root {
    --rail-bg: #ffffff;
    --tree-bg: #fcfcfc;
    --main-bg: #f0f0f0;
    --text-primary: #222222;
    --text-secondary: #737373;
    --accent: #18a0fb;
    --hover-bg: #f0f0f0;
    --border-color: #e5e5e5;
}

body {
    font-family:
        -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial,
        sans-serif;
    background-color: var(--main-bg);
    color: var(--text-primary);
    height: 100vh;
    overflow: hidden;
}

/* SPA Router Styles */
.page-view {
    display: none;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

.page-view.active {
    display: block;
}

/* Shared Buttons */
.primary-btn {
    background-color: var(--accent);
    color: white;
    border: none;
    padding: 12px 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s;
}

.primary-btn:hover {
    background-color: #0d8de0;
}

.primary-btn.full-width {
    width: 100%;
}