/* ================================================================
   Project Reset — complements modern-normalize
   Restores the Pico-equivalent base sizing that all rem values were
   authored against, without importing Pico's opinions.
   ================================================================ */

/* Responsive root font-size — Pico scaled the root from 100% to 131.25%
   at wider viewports. Every rem in the codebase was authored against this
   scale, so removing it shrinks the entire UI by ~20-30%. */
html {
    font-size: 100%;
    line-height: 1.5;
}
@media (min-width: 576px)  { html { font-size: 106.25%; } }
@media (min-width: 768px)  { html { font-size: 112.5%;  } }
@media (min-width: 1024px) { html { font-size: 118.75%; } }
@media (min-width: 1280px) { html { font-size: 125%;    } }
@media (min-width: 1536px) { html { font-size: 131.25%; } }

body {
    padding: 0;
    min-height: 100vh;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 400;
    background: var(--color-bg-page);
    color: var(--color-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* --- Typography defaults (replace Pico heading/paragraph spacing) --- */
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: 700;
}

p {
    margin: 0;
}

a {
    color: inherit;
}

/* --- Form element defaults — compact to match the app's dense design.
   Individual components set their own padding/font-size as needed. --- */
button,
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
    padding: 0.3rem 0.6rem;
    border: 1px solid var(--color-border-input);
    border-radius: 6px;
    font-size: 0.85rem;
    line-height: 1.5;
    background: #fff;
    color: var(--color-text);
}

select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%23697386' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.6rem center;
    padding-right: 2rem;
}

input[type="checkbox"] {
    border-radius: 2px;
}

button {
    cursor: pointer;
}

/* --- Scoped overrides (compact app layout) --- */
.main-content button,
.slideover button {
    margin-bottom: 0;
}

.main-content input:not([type="checkbox"]):not([type="radio"]),
.main-content select,
.slideover input:not([type="checkbox"]):not([type="radio"]),
.slideover select {
    margin-bottom: 0;
    height: auto;
    width: auto;
}

.main-content select:not([multiple]),
.slideover select:not([multiple]) {
    padding-right: 1.5rem;
    background-size: 1rem auto;
}

.main-content h1, .main-content h2, .main-content h3 {
    margin-bottom: 0;
}

.main-content p {
    margin-bottom: 0.5rem;
}

.main-content p:last-child {
    margin-bottom: 0;
}

.main-content section {
    margin: 1rem 0;
}

/* --- Table defaults --- */
table {
    border-collapse: collapse;
}

th, td {
    text-align: left;
}

/* --- Misc element defaults --- */
img, picture, video, canvas, svg {
    max-width: 100%;
}

code {
    font-size: 0.85em;
}

hr {
    border: 0;
    border-top: 1px solid var(--color-border);
    margin: 1rem 0;
}

/* --- Accessibility --- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}