/* ---------------------------------------------------------------------------
 * debugger.css - окно отладчика. Токены и базовые компоненты - в theme.css.
 *
 * Палитра листинга подобрана заново под тёмную тему с янтарным акцентом:
 * адрес - янтарный «структурный» цвет, байты и комментарии приглушённые,
 * прочие команды - светлый тёплый текст, а категории переходов, вызовов,
 * возвратов и управления прерываниями различаются цветом (см. .dc-* ниже).
 * ------------------------------------------------------------------------- */

.debugger {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 300;
    background-color: rgba(13, 13, 14, 0.88);
    backdrop-filter: blur(4px);
    color: var(--text);
    font-family: var(--mono);
    /* как в прежней версии: размер и плотность строк подобраны под фиксированные
       ширины колонок листинга (адрес 52px, байты 120px, команда 160px) */
    font-size: 16px;
    line-height: 1.25;
}
.debugger.is-open { display: flex; }

/* левая часть: вкладки + листинг */
.dwrapper {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
}
.duppermenu {
    display: flex;
    gap: 6px;
    padding: 12px 14px 0;
    border-bottom: 1px solid var(--border);
}
.duppermenuitem {
    padding: 7px 14px;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: var(--r-sm) var(--r-sm) 0 0;
    color: var(--text-dim);
    cursor: pointer;
    transition: background-color var(--t), color var(--t), border-color var(--t);
}
.duppermenuitem:hover {
    background-color: var(--surface);
    color: var(--text);
}
.duppermenuitem.is-active {
    background-color: var(--accent-soft);
    border-color: var(--accent-line);
    color: var(--accent-strong);
}

.dcode {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 10px 14px 18px;
}
.dcode.is-hidden { display: none; }

/* строка листинга: адрес, байты, мнемоника, комментарий.
   Геометрия колонок - как в прежней версии: фиксированные ширины, без зазоров,
   чтобы листинг был плотным и прижатым к левому краю. */
.debug_string {
    display: flex;
    align-items: baseline;
    min-width: 400px;
    margin-bottom: 1px;
    border-radius: 4px;
    white-space: nowrap;
}
.debug_string:hover { background-color: rgba(255, 255, 255, 0.045); }
/* строка, в которую вернулись по Escape */
.debug_string.is-current {
    background-color: var(--accent-soft);
    box-shadow: inset 2px 0 0 var(--accent);
}

.debug_addr {
    flex: 0 0 auto;
    width: 52px;
    color: #e6ab3b;
    cursor: pointer;
}
.debug_addr:hover {
    color: var(--accent-strong);
    text-decoration: underline;
}
.debug_bytes {
    flex: 0 0 auto;
    width: 120px;
    color: #a2a2a2;
}
.debug_cmd {
    flex: 0 0 auto;
    width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.debug_comment {
    flex: 1 1 auto;
    padding-left: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #a2a2a2;
}

/* --- палитра листинга -----------------------------------------------------
   Цвет кодирует смысл команды (как и было раньше): переходы, вызовы, возвраты,
   рестарты, ввод/вывод и управление прерываниями различаются, прочие команды
   остаются цветом текста. */
.dc-jp   { color: #6fb2ff; }   /* переход (был #57a9ff) */
.dc-jr   { color: #6fdfd2; }   /* относительный переход, DJNZ (был #73fbe8) */
.dc-call { color: #f2a94a; }   /* вызов подпрограммы (был #f7a439) */
.dc-ret  { color: #ff8a86; }   /* возврат (был #ff7676) */
.dc-rst  { color: #8ce07a; }   /* рестарт (был #7fff87) */
.dc-in   { color: #f58fd6; }   /* ввод из порта (был #f57fff) */
.dc-out  { color: #b18cf5; }   /* вывод в порт (был #a77fff) */
.dc-di   { color: #ff5f52; }   /* запрет прерываний (был #ff3636) */
.dc-ei   { color: #4fe07a; }   /* разрешение прерываний (был #17ff0f) */
/* куда можно перейти - курсор-рука и подчёркивание при наведении
   (рука только на тех командах, где клик действительно делает переход) */
.dc-jp,
.dc-jr,
.dc-call,
.dc-rst { cursor: pointer; }
.dc-jp:hover,
.dc-jr:hover,
.dc-call:hover,
.dc-rst:hover { text-decoration: underline; }

/* «компактный» листинг: байты и символы скрыты сразу во всех вкладках
   (кнопка внизу правой панели) */
.debugger.is-compact .debug_bytes,
.debugger.is-compact .debug_symbols { display: none; }

/* hex-вид и бинарные виды: ширина колонок и разметка - как в прежней версии
   (никаких растянутых hex-кодов, блоки битов во всю высоту строки) */
.hex_addr,
.bin1_addr,
.bin2_addr {
    flex: 0 0 auto;
    width: 52px;
    color: #e6ab3b;
}
.debug_symbols { display: block; }
.symb { color: var(--text); }
/* непечатаемый символ - тёмный квадратик, как и было */
.emptysymb {
    background-color: #423b2f;
}
/* биты показываются блоками: цифры окрашены в цвет фона и не видны */
.bit0,
.bit1 {
    height: 20px;
    width: 20px;
    margin-right: 1px;
    background-color: #423b2f;
    color: #423b2f;
    text-align: center;
}
/* выключенный бит - тёмный квадратик, включённый - акцентный янтарный темы
   (цифры окрашены в цвет фона, поэтому видны именно квадратики) */
.bit1 {
    background-color: var(--accent);
    color: var(--accent);
}

/* --- правая панель -------------------------------------------------------- */
.dpanel {
    flex: 0 0 auto;
    width: 25%;
    min-width: 340px;
    height: 100%;
    padding: 16px 16px 20px;
    border-left: 1px solid var(--border);
    background-color: rgba(0, 0, 0, 0.22);
    overflow-y: auto;
}
.dhint {
    margin-bottom: 16px;
    padding: 10px 12px;
    border: 1px dashed var(--border);
    border-radius: var(--r-sm);
    color: var(--text-mute);
    font-family: var(--font);
    font-size: var(--fs-sm);
    line-height: 1.5;
}

.z80state {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 14px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    background-color: var(--surface);
}
.flagsstate {
    grid-column: 1 / -1;
    display: flex;
    gap: 4px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
}
.flagsstate .regspan {
    flex: 1 1 0;
    padding: 3px 0;
    border-radius: 4px;
    background-color: var(--sunken);
    color: var(--text-mute);
    text-align: center;
}
.flagsstate .regspan.is-set {
    background-color: var(--accent-soft);
    color: var(--accent-strong);
}
.dcolumn {
    display: grid;
    gap: 4px;
    align-content: start;
}
.regspan {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 2px 6px;
    border-radius: 4px;
    color: var(--text-mute);
}
.regspan > span { color: var(--text); }

.z80statestring {
    grid-column: 1 / -1;
    display: flex;
    justify-content: space-between;
    padding: 7px 10px;
    border: 1px solid transparent;
    border-radius: var(--r-sm);
}
.z80statestring > span { color: var(--text); }
.bkred {
    background-color: rgba(224, 90, 72, 0.16);
    border-color: rgba(224, 90, 72, 0.42);
}
.bkblue {
    background-color: rgba(96, 158, 224, 0.16);
    border-color: rgba(96, 158, 224, 0.42);
}

#togglecodes {
    width: 100%;
    margin-top: 16px;
}
