/* Контейнер для правильного позиционирования кнопки над полем */
.input-wrapper {
    position: relative;
    width: 100%;
}

/* Стили для кнопки копирования верхнего поля */
.copy-input-btn {
    position: absolute;
    top: -28px; /* Поднимаем кнопку над textarea (на уровень текста) */
    right: 5px; /* Прижимаем к правому краю */
    width: 18px;
    height: 18px;
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s;
    display: none; /* По умолчанию скрыта */
}
        #copy_icon_btn:hover, 
.copy-input-btn:hover {
    opacity: 1;
}

/* Поддержка темной темы для новой кнопки */
        .dark #copy_icon_btn,
.dark .copy-input-btn {
    filter: invert(1);
}

      
    
        .tts-delay-label,
        #tts-segment-delay-input {
            display: none !important;
        }
        
        /* --- Иконка песочных часов для таймера --- */
        .memo-timer-icon {
            width: 12px;
            height: 12px;
            opacity: 0.6;
            vertical-align: middle;
            margin-top: -2px;
        }
        .memo-timer-icon.spaced {
            margin-right: 4px;
        }

        /* --- ФЕЙКОВЫЙ КОНТЕЙНЕР ТАЙМЕРА ДЛЯ ПЛЕЕРА --- */
        .dummy-ab-timer-container {
            position: absolute;
            right: 20px; 
            top: 32px;   
            background: transparent;
            border: 1px solid #ccc;
            border-radius: 4px;
            color: #777;
            font-size: 11px;
            font-family: sans-serif;
            font-weight: 700;
            padding: 2px 4px;
            display: none; /* Скрыт по умолчанию */
            align-items: center;
            justify-content: center;
            gap: 2px;
            z-index: 10;
            line-height: 1;
        }
        .dark .dummy-ab-timer-container {
            border-color: #555;
            color: #aaa;
        }

        /* --- ВСТРОЕННЫЙ ТАЙМЕР В РЯДУ С КНОПКАМИ --- */
        #memo-timer-status {
            display: none; 
            font-size: 14px;
            font-weight: 600;
            color: #0d6efd;
            background: rgba(13, 110, 253, 0.1);
            padding: 0 12px;
            border-radius: 6px;
            border: 1px solid rgba(13, 110, 253, 0.2);
            height: 38px; 
            align-items: center;
            justify-content: center;
            min-width: 42px;
            white-space: nowrap;
            user-select: none;
        }
        
        .dark #memo-timer-status {
            color: #6ea8fe;
            background: rgba(13, 110, 253, 0.15);
            border-color: rgba(110, 168, 254, 0.2);
        }

/* --- ОБЩИЙ ТАЙМЕР СЕССИИ (внутри плеера) --- */
#global-session-timer {
    position: absolute;
    left: 20px;        /* Слева */
    top: 32px;         /* На той же линии, что и таймер фрагментов */
    background: transparent;
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #777;
    font-size: 11px;
    font-family: sans-serif;
    font-weight: 700;
    padding: 2px 4px;
    display: none;     /* Появляется при старте */
    align-items: center;
    justify-content: center;
    z-index: 10;
    line-height: 1;
    pointer-events: none;
    font-variant-numeric: tabular-nums;
}

.dark #global-session-timer {
    border-color: #555;
    color: #aaa;
}



        /* --- ТЕМНАЯ ТЕМА --- */
        .dark .form-control,
        .dark .form-select {
            background-color: #222;
            color: #e0e0e0;
            border-color: #444;
        }
        .dark .form-control:focus,
        .dark .form-select:focus {
            background-color: #2a2a2a;
            color: #fff;
            border-color: #0d6efd;
        }
        .dark .form-control::placeholder {
            color: #777;
        }
        .dark .list-group-item {
            background-color: #222;
            color: #ccc;
            border-color: #444;
        }
        .dark .list-group-item a {
            color: #5c93fa; 
        }
        .dark .list-group-item a:hover {
            color: #7ab0ff;
        }
        .dark .form-check-label {
            color: #ccc;
        }

        #btn_reset_tts img, #reset-tts-btn img {
            opacity: 0.6;
            transition: all 0.2s;
        }
        #btn_reset_tts:hover img, #reset-tts-btn:hover img {
            opacity: 1;
        }
        
        /* базовая унификация кнопок */
        .memo-controls .btn{
          display:inline-flex;
          align-items:center;
          justify-content:center;
          height:38px;              
          padding:0 12px;           
          min-width:42px;           
          border-radius:6px;
          box-sizing:border-box;
          border-width:1px;
          border-style:solid;
          border-color:transparent; 
        }

        .memo-controls .btn.icon{ width:42px; padding:0; }
        .memo-controls .btn.text{ min-width:88px; padding:0 14px; }
        .dark .memo-controls .btn{ border-color: rgba(255,255,255,0.06); }
        
        
        /* =========================================
   CLEANED INLINE STYLES (Layout & UI)
   ========================================= */

#global-session-timer {
    display: none;
}

/* Flex Containers & Gaps */
.flex-col-gap-15 { display: flex; flex-direction: column; gap: 15px; }
.flex-col-gap-8 { display: flex; flex-direction: column; gap: 8px; }
.flex-row-gap-10-mb { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.flex-center-gap-8 { display: flex; align-items: center; gap: 8px; }

/* Custom Switches */
.custom-switch-input {
    margin: 0;
    width: 3em;
    height: 1.5em;
    cursor: pointer;
}
.custom-switch-label {
    margin: 0;
    cursor: pointer;
    user-select: none;
}
.custom-switch-label-sm {
    margin: 0;
    cursor: pointer;
    user-select: none;
    font-size: 14px;
}

/* Dict Link */
.dict-link-wrapper {
    text-align: right;
    margin-bottom: 5px;
}
.dict-link {
    text-decoration: none;
    cursor: pointer;
}

/* Settings Modal Grid */
.settings-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

/* Modal UI Elements */
.setting-label-flex {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}
.setting-input-w60 {
    width: 60px;
}
.setting-input-w50-center {
    width: 50px;
    text-align: center;
}
.label-nowrap {
    white-space: nowrap;
}
.memo-btn-sm-text {
    font-size: 13px;
}

/* Z-index fix for top modal */
.modal-top-z {
    z-index: 10500 !important;
}

.cursor-pointer {
    cursor: pointer;
}

.compass-icon {
    width: 22px;
    height: 22px;
}

.btn-memo-action {
    height: 38px; 
    display: inline-flex;
    align-items: center;
    justify-content: center;
}