/* PhotoShare.Web/wwwroot/app.css */

/* Inter laden — zwei Gewichte, mehr brauchen wir nicht */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap');

/* Globale Resets — Body bekommt unseren Cream-Fond und Anthrazit-Text */
html, body {
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    background-color: #FAF7F2;
    color: #2A2A28;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Wir wollen nirgendwo Title Case oder UPPERCASE per Default */
button, input, select, textarea {
    font-family: inherit;
    text-transform: none;
}

/* ---- Layout-Container ---- */

.ps-app-shell {
    min-height: 100vh;
}

.ps-app-content {
    /* genau die AppBar-Höhe */
/*    padding-top: 56px; */
}

/* Schmal — für Auth, Formulare, Profil-artiges */
.ps-container-narrow {
    max-width: 480px;
    margin: 0 auto;
    padding: 24px 16px;
}

/* Breit — für Galerie und Event-Detail */
.ps-container-wide {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 16px;
}

.ps-empty-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.ps-empty-brand {
    text-align: center;
    padding: 24px 16px 12px;
    font-size: 14px;
    font-weight: 500;
    color: #6B6B68;
    letter-spacing: 0.04em;
}

.ps-empty-main {
    flex: 1;
    display: flex;
    flex-direction: column;
}

@media (min-width: 600px) {
    .ps-container-narrow,
    .ps-container-wide {
        padding: 32px 24px;
    }
}

/* ---- Cards mit etwas mehr Charakter als Mud-Default ---- */

.ps-card {
    background-color: #FFFBF5;
    border: 0.5px solid #E5DFD3;
    border-radius: 12px;
    padding: 20px;
}

.ps-card--clickable {
    cursor: pointer;
    transition: border-color 0.15s ease;
}

    .ps-card--clickable:hover {
        border-color: #C8BEAB;
    }

/* ---- AppBar-Anpassung ---- */

.ps-appbar {
    border-bottom: 0.5px solid #E5DFD3 !important;
}

/* ---- MudBlazor-Overrides für Konsistenz ---- */

/* Default-Button-Höhe auf 48px für Mobile-Touch-Targets */
.mud-button-root {
    min-height: 44px;
}

/* Snackbars sollen warm aussehen, nicht knallig */
.mud-snackbar {
    border-radius: 8px !important;
}

.text-wrap-any {
    overflow-wrap: anywhere;
}