/* Shared PictureSweep logo + sub-page header.
   Edit here once — every PictureSweep page picks it up. */

/* Logo — swaps with the active theme so the matching app icon always shows
   (light icon on light, dark icon on dark). */
.ps-logo {
    background-image: url(/shared/picturesweep-icon.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
[data-theme="light"] .ps-logo { background-image: url(/shared/picturesweep-icon.png); }
[data-theme="dark"]  .ps-logo { background-image: url(/shared/picturesweep-icon-dark.png); }
@media (prefers-color-scheme: dark) {
    [data-theme="apple"] .ps-logo { background-image: url(/shared/picturesweep-icon-dark.png); }
}

/* Consistent header for the sub-pages (Support, Datenschutz),
   injected by /shared/picturesweep-nav.js into the page container. */
.ps-pagehead {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 34px;
}
.ps-pagehead .ps-logo {
    width: 38px; height: 38px;
    border-radius: 9px;
    flex: 0 0 auto;
}
.ps-pagehead .ps-name {
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--text-primary, #1a1a2e);
    text-decoration: none;
}
.ps-pagehead .ps-links {
    margin-left: auto;
    display: flex;
    gap: 16px;
}
.ps-pagehead .ps-links a {
    color: var(--text-secondary, #888);
    text-decoration: none;
    font-size: .88rem;
}
.ps-pagehead .ps-links a:hover { color: #FF8A00; }

@media (max-width: 480px) {
    .ps-pagehead .ps-links { gap: 12px; }
    .ps-pagehead .ps-links a { font-size: .82rem; }
}