/**
 * IPTV Web App - TV-specific Styles
 * Optimized for large screens and remote control navigation
 */

/* TV mode detection - large screens without touch */
@media (min-width: 1280px) and (hover: hover) and (pointer: fine),
       (min-width: 1280px) and (hover: none) {

    :root {
        --sidebar-width: 260px;
    }

    html {
        font-size: 18px;
    }

    /* Larger focus indicators */
    [data-focused="true"],
    .focused {
        outline-width: 4px !important;
        outline-offset: 3px;
    }

    /* Larger click targets */
    .sidebar-item {
        padding: 16px 20px;
        gap: 16px;
    }

    .sidebar-label {
        font-size: 17px;
    }

    .sidebar-icon {
        width: 26px;
        height: 26px;
    }

    /* Channel cards */
    .channel-card {
        padding: 18px;
        gap: 16px;
    }

    .channel-logo-wrap {
        width: 64px;
        height: 64px;
    }

    .channel-name {
        font-size: 17px;
    }

    /* Group tabs */
    .group-tab {
        padding: 10px 22px;
        font-size: 15px;
    }

    /* Search */
    .search-input {
        padding: 16px 24px;
        font-size: 18px;
    }

    /* Settings */
    .settings-input {
        padding: 12px 16px;
    }

    .settings-btn {
        padding: 12px 24px;
    }

    /* OSD */
    .osd-channel-name {
        font-size: 28px;
    }

    .osd-logo {
        width: 72px;
        height: 72px;
    }
}

/* Extra large screens (4K TVs) */
@media (min-width: 3000px) {
    html {
        font-size: 24px;
    }

    :root {
        --sidebar-width: 350px;
        --radius: 16px;
        --radius-sm: 10px;
    }

    .channel-logo-wrap {
        width: 80px;
        height: 80px;
    }
}

/* Disable text selection on TV */
@media (hover: none) {
    * {
        -webkit-user-select: none;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
    }

    input, textarea {
        -webkit-user-select: text;
        user-select: text;
    }
}

/* Smooth focus transitions */
[data-focusable] {
    transition: transform 150ms ease, background 150ms ease, box-shadow 150ms ease, outline-color 150ms ease;
}

/* Scale up on focus for TV readability */
@media (hover: none) {
    .channel-card.focused,
    .vod-card.focused {
        transform: scale(1.05);
        z-index: 10;
    }

    .sidebar-item.focused {
        transform: scale(1.02);
    }
}