daggerheart/styles/less/global/sheet.less

@import '../utils/colors.less';
@import '../utils/fonts.less';
@import '../utils/mixin.less';

// Theme handling
.appTheme({
    background: @semi-transparent-dark-blue;
    backdrop-filter: blur(9px);
}, {
    background: url('../assets/parchments/dh-parchment-light.png') no-repeat center;
});

.application.sheet.dh-style {
    border-radius: 10px;

    // Window header styles
    .window-header {
        background: transparent;
        border-bottom: none;
        justify-content: end;

        h1 {
            color: light-dark(@dark-blue, @beige);
            font-family: @font-body;
        }

        button {
            background: light-dark(transparent, @deep-black);
            color: light-dark(@dark-blue, @beige);
            border: 1px solid light-dark(@dark-blue, transparent);
            padding: 0;

            &:hover {
                border-color: light-dark(@dark-blue, @golden);
                color: light-dark(@dark-blue, @golden);
            }
        }
    }

    // Window content transitions
    .window-content {
        padding: 0;
        position: relative;
        top: -36px;
        min-height: -webkit-fill-available;
        transition: opacity 0.3s ease;

        .tab {
            padding: 0 10px;
        }
    }

    // Minimized states
    &.minimized .window-content {
        opacity: 0;
        transition-duration: 0.1s;
    }

    &:not(.minimized) {
        .window-title,
        .window-icon {
            display: none;
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        .window-content {
            opacity: 1;
        }
    }
}