/*
 * Robbie Rose Gallery - Back Arrow Styles
 * Centralized styles for back navigation arrows across all pages.
 */

/* Consistent Back Chevron (boxless, top-left positioned) */
.back-chevron {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 10;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: var(--color-silver-700);
    text-decoration: none;
    transition: color 0.3s ease, transform 0.3s ease;
    pointer-events: auto;
}

.back-chevron svg {
    width: 20px;
    height: 20px;
    stroke: currentColor;
    stroke-width: 2;
}

.back-chevron:hover {
    color: var(--color-silver-800);
    transform: translateX(-2px);
}

.back-chevron.back-hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(-4px);
}

/* Ensure headers have space for the chevron */
.site-header,
.process-header,
.context-header,
.page-header {
    position: relative;
    padding-left: 3.5rem; /* Space for chevron + padding */
}

/* SCOPED RULE: Only apply back-chevron styling to buttons inside a header */
.site-header .back-button,
.process-header .back-button,
.context-header .back-button {
    /* Use the .back-chevron styles */
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 10;
}

/* Drawer back remains as is, since it's inside drawer, not header */