/* Tema rústico “barbearia” (madeira/couro) */
:root {
    --wood: rgba(199, 154, 90, 0.12);
    --leather: rgba(83, 56, 35, 0.18);
}

#app-shell {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

#app-header,
#app-footer {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
    border-bottom: 1px solid var(--border);
}

#app-footer {
    border-top: 1px solid var(--border);
    border-bottom: none;
    margin-top: auto;
}

.brand {
    display: flex;
    align-items: center;
    gap: 10px;
    letter-spacing: 0.5px;
}

.brand-badge {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.14), transparent 60%),
        linear-gradient(180deg, rgba(199, 154, 90, 0.9), rgba(168, 122, 62, 0.85));
    box-shadow: var(--shadow);
}

.brand-title {
    font-weight: 800;
    text-transform: uppercase;
    font-size: 14px;
    color: var(--text);
}

.brand-subtitle {
    display: block;
    font-size: 12px;
    color: var(--muted);
    font-weight: 500;
}