/* Windows Controls Overlay CSS */

/* Title bar alanı */
.titlebar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 32px;
    background: linear-gradient(90deg, #0d6efd 0%, #0b5ed7 100%);
    color: white;
    display: flex;
    align-items: center;
    padding: 0 12px;
    font-size: 14px;
    font-weight: 500;
    z-index: 9999;
    -webkit-app-region: drag; /* Sürüklenebilir alan */
}

/* Title bar içeriği */
.titlebar-content {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
}

/* Logo/icon */
.titlebar-icon {
    width: 16px;
    height: 16px;
    background-image: url('../images/android-chrome-192x192.png');
    background-size: contain;
    background-repeat: no-repeat;
}

/* Uygulama adı */
.titlebar-title {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Kontrol butonları alanı */
.titlebar-controls {
    display: flex;
    align-items: center;
    gap: 2px;
    -webkit-app-region: no-drag; /* Sürüklenemez alan */
}

/* Kontrol butonları */
.titlebar-button {
    width: 46px;
    height: 32px;
    border: none;
    background: transparent;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.2s;
}

.titlebar-button:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.titlebar-button.close:hover {
    background-color: #e81123;
}

/* Ana içerik alanını title bar'ın altına kaydır */
.main-content {
    margin-top: 32px;
}

/* Windows'ta PWA olduğunda title bar'ı göster */
@media (display-mode: window-controls-overlay) {
    .titlebar {
        display: flex;
    }
    
    .main-content {
        margin-top: 32px;
    }
}

/* Diğer platformlarda title bar'ı gizle */
@media not (display-mode: window-controls-overlay) {
    .titlebar {
        display: none;
    }
    
    .main-content {
        margin-top: 0;
    }
}