// ==========================================================================
// PressZone Theme - CSS Reset / Base Styles
// ==========================================================================
// Normalize and reset browser defaults
// Uses Sass variables with body.dark-mode & nesting pattern.
// ==========================================================================

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: $font-family-base;
    font-size: $font-size-base;
    line-height: $line-height-base;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    background-color: $light-bg-primary;
    color: $light-text-primary;

    &.dark-mode {
        background-color: $dark-bg-primary;
        color: $dark-text-primary;
    }
}

// Note: No body padding needed - header uses position: sticky
// which stays in the normal document flow

// --------------------------------------------------------------------------
// Layout Structure
// --------------------------------------------------------------------------
.site {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.site-main {
    flex: 1;
}

.site-footer {
    margin-top: auto;
}

// --------------------------------------------------------------------------
// Base Element Resets
// --------------------------------------------------------------------------
img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    text-decoration: none;
    color: $color-primary;
    transition: color $transition-base;

    &:hover {
        text-decoration: none;
        color: $color-primary-hover;
    }

    body.dark-mode & {
        color: $color-primary-light;

        &:hover {
            color: $color-primary;
        }
    }
}

button {
    cursor: pointer;
    font-family: inherit;
}

// --------------------------------------------------------------------------
// Accessibility
// --------------------------------------------------------------------------
.skip-link {
    @include sr-only;

    &:focus {
        position: fixed;
        top: 0.5rem;
        left: 0.5rem;
        z-index: 99999;
        width: auto;
        height: auto;
        padding: 0.75rem 1.5rem;
        background: $color-primary;
        color: #ffffff;
        font-weight: $font-weight-medium;
        text-decoration: none;
        border-radius: $border-radius;
        clip: auto;
        white-space: normal;
    }
}

.screen-reader-text {
    @include sr-only;
}

// --------------------------------------------------------------------------
// Selection
// --------------------------------------------------------------------------
::selection {
    background-color: $color-primary;
    color: #ffffff;
}
