/**
 * Плейлисты: страница списка, просмотр, модалки создания/удаления.
 * Светлая и lo-fi («Оригинальная») темы.
 */

/* ═══════════════════════════════════════
   Светлая — страница «Плейлисты»
   ═══════════════════════════════════════ */
html.light-theme .playlists-page-container .playlist-card,
html.light-theme .playlists-grid .playlist-card,
body.light-theme .playlists-page-container .playlist-card,
body.light-theme .playlists-grid .playlist-card {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

html.light-theme .playlists-page-container .playlist-card:hover,
html.light-theme .playlists-grid .playlist-card:hover,
body.light-theme .playlists-page-container .playlist-card:hover,
body.light-theme .playlists-grid .playlist-card:hover {
    background: #fafafa !important;
    border-color: #d8d8d8 !important;
}

html.light-theme .playlists-page-container .playlist-info h3,
html.light-theme .playlists-page-container .view-playlist-text,
body.light-theme .playlists-page-container .playlist-info h3,
body.light-theme .playlists-page-container .view-playlist-text {
    color: #0f0f0f !important;
}

html.light-theme .playlists-page-container .playlist-info .playlist-meta,
html.light-theme .playlists-page-container .playlist-info .view-playlist-link,
body.light-theme .playlists-page-container .playlist-info .playlist-meta,
body.light-theme .playlists-page-container .playlist-info .view-playlist-link {
    color: #606060 !important;
}

html.light-theme .playlists-page-container .playlist-info .view-playlist-link:hover,
body.light-theme .playlists-page-container .playlist-info .view-playlist-link:hover {
    color: #065fd4 !important;
}

html.light-theme .playlists-page-container .playlist-thumbnail-placeholder,
body.light-theme .playlists-page-container .playlist-thumbnail-placeholder {
    background: #e8e8e8 !important;
}

html.light-theme .playlists-page-container .playlist-thumbnail-placeholder img,
body.light-theme .playlists-page-container .playlist-thumbnail-placeholder img {
    filter: brightness(0) opacity(0.4) !important;
}

html.light-theme .playlists-page-container .playlist-deleted-placeholder,
body.light-theme .playlists-page-container .playlist-deleted-placeholder {
    background: #f8f9fa !important;
    border-color: #e0e0e0 !important;
    color: #606060 !important;
}

/* Модалки на странице плейлистов */
html.light-theme #create-playlist-modal .modal-content,
html.light-theme #delete-playlist-modal .modal-content,
html.light-theme #confirmation-delete-modal .modal-content,
body.light-theme #create-playlist-modal .modal-content,
body.light-theme #delete-playlist-modal .modal-content,
body.light-theme #confirmation-delete-modal .modal-content {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    color: #0f0f0f !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.14) !important;
}

html.light-theme #create-playlist-modal .modal-content h2,
html.light-theme #delete-playlist-modal .modal-content h2,
html.light-theme #confirmation-delete-modal .modal-content h3,
body.light-theme #create-playlist-modal .modal-content h2,
body.light-theme #delete-playlist-modal .modal-content h2,
body.light-theme #confirmation-delete-modal .modal-content h3 {
    color: #0f0f0f !important;
}

html.light-theme #create-playlist-modal .form-group label,
html.light-theme #create-playlist-modal .modal-description,
html.light-theme #char-counter,
body.light-theme #create-playlist-modal .form-group label,
body.light-theme #create-playlist-modal .modal-description,
body.light-theme #char-counter {
    color: #606060 !important;
}

html.light-theme #create-playlist-modal .form-group input[type="text"],
html.light-theme #create-playlist-modal .form-group textarea,
body.light-theme #create-playlist-modal .form-group input[type="text"],
body.light-theme #create-playlist-modal .form-group textarea {
    background: #fafafa !important;
    border: 1px solid #e0e0e0 !important;
    color: #0f0f0f !important;
}

html.light-theme #create-playlist-modal .form-group input:focus,
html.light-theme #create-playlist-modal .form-group textarea:focus,
body.light-theme #create-playlist-modal .form-group input:focus,
body.light-theme #create-playlist-modal .form-group textarea:focus {
    border-color: #065fd4 !important;
    box-shadow: 0 0 0 2px rgba(6, 95, 212, 0.12) !important;
}

html.light-theme #create-playlist-modal .visibility-options,
body.light-theme #create-playlist-modal .visibility-options {
    background: #f8f9fa !important;
    border: 1px solid #e8e8e8 !important;
}

html.light-theme #create-playlist-modal .visibility-options label:hover,
body.light-theme #create-playlist-modal .visibility-options label:hover {
    background: rgba(0, 0, 0, 0.04) !important;
}

html.light-theme #create-playlist-modal .visibility-options span,
body.light-theme #create-playlist-modal .visibility-options span {
    color: #757575 !important;
}

html.light-theme #create-playlist-modal .visibility-options input[type="radio"]:checked + .visibility-icon + span,
body.light-theme #create-playlist-modal .visibility-options input[type="radio"]:checked + .visibility-icon + span {
    color: #0f0f0f !important;
    font-weight: 600;
}

html.light-theme #create-playlist-modal .visibility-options .visibility-icon,
body.light-theme #create-playlist-modal .visibility-options .visibility-icon {
    filter: brightness(0) opacity(0.5) !important;
}

html.light-theme #create-playlist-modal .visibility-options input[type="radio"]:checked + .visibility-icon,
body.light-theme #create-playlist-modal .visibility-options input[type="radio"]:checked + .visibility-icon {
    filter: brightness(0) opacity(0.85) !important;
}

html.light-theme #create-playlist-modal .modal-button.cancel,
html.light-theme #delete-playlist-modal .modal-button.cancel,
body.light-theme #create-playlist-modal .modal-button.cancel,
body.light-theme #delete-playlist-modal .modal-button.cancel {
    background: #f2f2f2 !important;
    color: #0f0f0f !important;
}

html.light-theme #create-playlist-modal .modal-button.create,
body.light-theme #create-playlist-modal .modal-button.create {
    background: #065fd4 !important;
    color: #ffffff !important;
}

html.light-theme #delete-playlist-modal .playlist-delete-item,
body.light-theme #delete-playlist-modal .playlist-delete-item {
    color: #0f0f0f !important;
}

html.light-theme #delete-playlist-modal .playlist-delete-item:hover,
body.light-theme #delete-playlist-modal .playlist-delete-item:hover {
    background: #f2f2f2 !important;
}

html.light-theme #confirmation-delete-modal .modal-content p,
body.light-theme #confirmation-delete-modal .modal-content p {
    color: #606060 !important;
}

/* ═══════════════════════════════════════
   Светлая — просмотр плейлиста
   ═══════════════════════════════════════ */
html.light-theme .playlist-view-container .video-title a,
html.light-theme .playlist-view-container .video-channel-link,
body.light-theme .playlist-view-container .video-title a,
body.light-theme .playlist-view-container .video-channel-link {
    color: #0f0f0f !important;
}

html.light-theme .playlist-view-container .video-channel-link,
body.light-theme .playlist-view-container .video-channel-link {
    color: #606060 !important;
}

html.light-theme .playlist-view-container .video-index,
body.light-theme .playlist-view-container .video-index {
    color: #909090 !important;
}

html.light-theme .playlist-view-container .is-playing .video-index,
body.light-theme .playlist-view-container .is-playing .video-index {
    color: #065fd4 !important;
}

html.light-theme .playlist-view-container .playlist-video-item.is-playing,
body.light-theme .playlist-view-container .playlist-video-item.is-playing {
    background: rgba(6, 95, 212, 0.08) !important;
}

html.light-theme .playlist-view-container .context-menu-button,
body.light-theme .playlist-view-container .context-menu-button {
    opacity: 1 !important;
}

html.light-theme .playlist-view-container .context-menu-button img,
body.light-theme .playlist-view-container .context-menu-button img {
    filter: brightness(0) opacity(0.55) !important;
}

html.light-theme .playlist-view-container .thumbnail-duration,
body.light-theme .playlist-view-container .thumbnail-duration {
    color: #ffffff !important;
    background-color: rgba(0, 0, 0, 0.82) !important;
}

/* ═══════════════════════════════════════
   Lo-fi — страница «Плейлисты»
   ═══════════════════════════════════════ */
html.original-theme .playlists-page-container .playlist-info h3,
html.original-theme .playlists-page-container .view-playlist-text,
body.original-theme .playlists-page-container .playlist-info h3,
body.original-theme .playlists-page-container .view-playlist-text {
    color: #4a3f35 !important;
}

html.original-theme .playlists-page-container .playlist-info .view-playlist-link,
body.original-theme .playlists-page-container .playlist-info .view-playlist-link {
    color: #8b7355 !important;
}

html.original-theme .playlists-page-container .playlist-info .view-playlist-link:hover,
body.original-theme .playlists-page-container .playlist-info .view-playlist-link:hover {
    color: #b0784e !important;
}

html.original-theme .playlists-page-container .playlist-deleted-placeholder,
body.original-theme .playlists-page-container .playlist-deleted-placeholder {
    background: rgba(255, 254, 251, 0.6) !important;
    border-color: rgba(180, 150, 120, 0.28) !important;
    color: #8b7355 !important;
}

/* Модалки */
html.original-theme #create-playlist-modal .modal-content,
html.original-theme #delete-playlist-modal .modal-content,
html.original-theme #confirmation-delete-modal .modal-content,
body.original-theme #create-playlist-modal .modal-content,
body.original-theme #delete-playlist-modal .modal-content,
body.original-theme #confirmation-delete-modal .modal-content {
    background: linear-gradient(165deg, #fffefb 0%, #faf6f0 55%, #f5ebe2 100%) !important;
    border: 1px solid rgba(180, 150, 120, 0.24) !important;
    color: #4a3f35 !important;
    box-shadow: 0 20px 56px rgba(74, 63, 53, 0.16) !important;
}

html.original-theme #create-playlist-modal .modal-content h2,
html.original-theme #delete-playlist-modal .modal-content h2,
html.original-theme #confirmation-delete-modal .modal-content h3,
body.original-theme #create-playlist-modal .modal-content h2,
body.original-theme #delete-playlist-modal .modal-content h2,
body.original-theme #confirmation-delete-modal .modal-content h3 {
    color: #5c4a3d !important;
}

html.original-theme #create-playlist-modal .form-group label,
html.original-theme #create-playlist-modal .modal-description,
html.original-theme #char-counter,
body.original-theme #create-playlist-modal .form-group label,
body.original-theme #create-playlist-modal .modal-description,
body.original-theme #char-counter {
    color: #8b7355 !important;
}

html.original-theme #create-playlist-modal .form-group input[type="text"],
html.original-theme #create-playlist-modal .form-group textarea,
body.original-theme #create-playlist-modal .form-group input[type="text"],
body.original-theme #create-playlist-modal .form-group textarea {
    background: #fffefb !important;
    border: 1px solid rgba(180, 150, 120, 0.28) !important;
    color: #4a3f35 !important;
}

html.original-theme #create-playlist-modal .form-group input:focus,
html.original-theme #create-playlist-modal .form-group textarea:focus,
body.original-theme #create-playlist-modal .form-group input:focus,
body.original-theme #create-playlist-modal .form-group textarea:focus {
    border-color: #c4895a !important;
    box-shadow: 0 0 0 2px rgba(196, 137, 90, 0.18) !important;
}

html.original-theme #create-playlist-modal .visibility-options,
body.original-theme #create-playlist-modal .visibility-options {
    background: rgba(255, 254, 251, 0.85) !important;
    border: 1px solid rgba(180, 150, 120, 0.22) !important;
}

html.original-theme #create-playlist-modal .visibility-options label:hover,
body.original-theme #create-playlist-modal .visibility-options label:hover {
    background: #f5efe6 !important;
}

html.original-theme #create-playlist-modal .visibility-options span,
body.original-theme #create-playlist-modal .visibility-options span {
    color: #8b7355 !important;
}

html.original-theme #create-playlist-modal .visibility-options input[type="radio"]:checked + .visibility-icon + span,
body.original-theme #create-playlist-modal .visibility-options input[type="radio"]:checked + .visibility-icon + span {
    color: #4a3f35 !important;
    font-weight: 600;
}

html.original-theme #create-playlist-modal .visibility-options .visibility-icon,
body.original-theme #create-playlist-modal .visibility-options .visibility-icon {
    filter: brightness(0) saturate(100%) opacity(0.42) !important;
}

html.original-theme #create-playlist-modal .visibility-options input[type="radio"]:checked + .visibility-icon,
body.original-theme #create-playlist-modal .visibility-options input[type="radio"]:checked + .visibility-icon {
    filter: brightness(0) saturate(100%) opacity(0.72) !important;
}

html.original-theme #create-playlist-modal .modal-button.cancel,
html.original-theme #delete-playlist-modal .modal-button.cancel,
html.original-theme #confirmation-delete-modal .modal-button.confirm-cancel,
body.original-theme #create-playlist-modal .modal-button.cancel,
body.original-theme #delete-playlist-modal .modal-button.cancel,
body.original-theme #confirmation-delete-modal .modal-button.confirm-cancel {
    background: #fffefb !important;
    border: 1px solid rgba(180, 150, 120, 0.3) !important;
    color: #6b5a48 !important;
}

html.original-theme #create-playlist-modal .modal-button.cancel:hover,
body.original-theme #create-playlist-modal .modal-button.cancel:hover {
    background: #f5efe6 !important;
    color: #4a3f35 !important;
}

html.original-theme #create-playlist-modal .modal-button.create,
html.original-theme #confirmation-delete-modal .modal-button.confirm-ok,
body.original-theme #create-playlist-modal .modal-button.create,
body.original-theme #confirmation-delete-modal .modal-button.confirm-ok {
    background: linear-gradient(135deg, #c4895a 0%, #b8927a 100%) !important;
    color: #fffdf9 !important;
}

html.original-theme #delete-playlist-modal .playlist-delete-item,
body.original-theme #delete-playlist-modal .playlist-delete-item {
    color: #4a3f35 !important;
}

html.original-theme #delete-playlist-modal .playlist-delete-item:hover,
body.original-theme #delete-playlist-modal .playlist-delete-item:hover {
    background: #f5efe6 !important;
}

html.original-theme #delete-playlist-modal .modal-button.delete,
body.original-theme #delete-playlist-modal .modal-button.delete {
    background: rgba(168, 90, 100, 0.15) !important;
    color: #9e4f48 !important;
    border: 1px solid rgba(168, 90, 100, 0.35) !important;
}

html.original-theme #confirmation-delete-modal .modal-content p,
body.original-theme #confirmation-delete-modal .modal-content p {
    color: #8b7355 !important;
}

/* ═══════════════════════════════════════
   Lo-fi — просмотр плейлиста
   ═══════════════════════════════════════ */
html.original-theme .playlist-view-container .playlist-meta-info,
html.original-theme .playlist-view-container .playlist-meta-info span,
body.original-theme .playlist-view-container .playlist-meta-info,
body.original-theme .playlist-view-container .playlist-meta-info span {
    color: #8b7355 !important;
}

html.original-theme .playlist-view-container .playlist-meta-owner-label,
html.original-theme .playlist-info-sidebar .playlist-meta-owner-name,
html.original-theme .playlist-info-sidebar .playlist-meta-owner-link,
body.original-theme .playlist-view-container .playlist-meta-owner-label,
body.original-theme .playlist-info-sidebar .playlist-meta-owner-name,
body.original-theme .playlist-info-sidebar .playlist-meta-owner-link {
    color: #4a3f35 !important;
}

html.original-theme .playlist-info-sidebar .playlist-meta-owner-label,
body.original-theme .playlist-info-sidebar .playlist-meta-owner-label {
    color: #8b7355 !important;
}

html.original-theme .playlist-view-container .video-title a,
body.original-theme .playlist-view-container .video-title a {
    color: #4a3f35 !important;
}

html.original-theme .playlist-view-container .video-channel-link,
body.original-theme .playlist-view-container .video-channel-link {
    color: #8b7355 !important;
}

html.original-theme .playlist-view-container .video-channel-link:hover,
body.original-theme .playlist-view-container .video-channel-link:hover {
    color: #5c4a3d !important;
}

html.original-theme .playlist-view-container .video-index,
body.original-theme .playlist-view-container .video-index {
    color: #8b7355 !important;
}

html.original-theme .playlist-view-container .playlist-video-item:hover,
body.original-theme .playlist-view-container .playlist-video-item:hover {
    background: rgba(245, 239, 230, 0.9) !important;
}

html.original-theme .playlist-view-container .playlist-video-item.is-playing,
body.original-theme .playlist-view-container .playlist-video-item.is-playing {
    background: rgba(232, 196, 168, 0.4) !important;
}

html.original-theme .playlist-view-container .is-playing .video-index,
body.original-theme .playlist-view-container .is-playing .video-index {
    color: #c4895a !important;
}

html.original-theme .playlist-view-container .context-menu-button,
body.original-theme .playlist-view-container .context-menu-button {
    opacity: 1 !important;
}

html.original-theme .playlist-view-container .context-menu-button:hover,
body.original-theme .playlist-view-container .context-menu-button:hover {
    background: rgba(245, 239, 230, 0.95) !important;
}

html.original-theme .playlist-view-container .video-list-container,
body.original-theme .playlist-view-container .video-list-container {
    background: rgba(255, 254, 251, 0.35);
    border-radius: 16px;
    padding: 4px 0;
}

/* Модалка «Описание плейлиста» — светлая тема */
html.light-theme #edit-playlist-description-modal .modal-content-small h3,
body.light-theme #edit-playlist-description-modal .modal-content-small h3 {
    color: #0f0f0f !important;
}

html.light-theme #edit-playlist-description-modal .form-group-small label,
body.light-theme #edit-playlist-description-modal .form-group-small label {
    color: #606060 !important;
}

html.light-theme #edit-playlist-description-modal .playlist-description-textarea,
body.light-theme #edit-playlist-description-modal .playlist-description-textarea {
    background: #fafafa !important;
    border: 1px solid #e0e0e0 !important;
    color: #0f0f0f !important;
}

html.light-theme #edit-playlist-description-modal .playlist-description-textarea:focus,
body.light-theme #edit-playlist-description-modal .playlist-description-textarea:focus {
    border-color: #065fd4 !important;
    box-shadow: 0 0 0 2px rgba(6, 95, 212, 0.12) !important;
}

html.light-theme #edit-playlist-description-modal .playlist-description-counter,
body.light-theme #edit-playlist-description-modal .playlist-description-counter {
    color: #606060 !important;
}

html.light-theme #edit-playlist-description-modal .modal-button-small.cancel,
body.light-theme #edit-playlist-description-modal .modal-button-small.cancel {
    background: #f2f2f2 !important;
    color: #0f0f0f !important;
    border: 1px solid #e0e0e0 !important;
}

html.light-theme #edit-playlist-description-modal .modal-button-small.create,
body.light-theme #edit-playlist-description-modal .modal-button-small.create {
    background: #065fd4 !important;
    color: #ffffff !important;
}