@layer t2.plugin {
/* Path: T2Editor/plugin/code/code.css */
/* Rationale: code 선택자는 플러그인 루트 아래로 제한하고 공개 본문 표현이 필요하면 css/content.css도 함께 수정한다. */

.t2-code-block {

    padding: var(--t2-s3);

    font-family: 'Consolas', 'Monaco', monospace;
    position: relative;
    margin: var(--t2-s2) 0;
}

.t2-code-block .code-placeholder {
    color: inherit;
    cursor: text;
}
.t2-code-block .code-placeholder:empty::before {
    content: attr(data-placeholder);
    color: var(--t2-ink-muted);
    pointer-events: none;
}
.t2-code-block .code-placeholder:focus::before { content: ''; }

.t2-code-block pre {
    margin: 0;
    white-space: pre-wrap;
}

.t2-code-block code {
    outline: none;
    display: block;
    min-height: 1em;
    font-family: 'Consolas', 'Monaco', monospace;
    line-height: 1.5;
    white-space: pre;
    word-wrap: normal;
    overflow-wrap: normal;
}

/* Media Block Wrapper adjustments for Code */
.t2-media-block.t2-code-block {
    padding: 0;
    border: none;
    background: transparent;
}

.t2-media-block.t2-code-block > div:first-child {
    background: var(--t2-workspace);
    padding: var(--t2-s3);
    border-radius: var(--t2-radius-control);
    font-family: 'Consolas', 'Monaco', monospace;
}

/* Dark Mode */
html[data-t2editor-theme="dark"] .t2-code-block {
    background-color: var(--t2-surface);
    border: 1px solid var(--t2-ink-muted);
    color: var(--t2-ink);
}

html[data-t2editor-theme="dark"] .t2-media-block.t2-code-block > div:first-child {
    background-color: var(--t2-surface);
    border: 1px solid var(--t2-ink-muted);
}

html[data-t2editor-theme="dark"] .t2-code-block pre,
html[data-t2editor-theme="dark"] .t2-code-block code {
    color: var(--t2-ink);
}

html[data-t2editor-theme="dark"] .t2-code-block .code-placeholder:empty::before {
    color: var(--t2-ink-muted);
}

/* T2Editor Coding-Agent Rule: Write only concise, high-value comments. Preserve "Path: T2Editor/..." comments; update them when files move—never delete them. */

/* T2Editor /law official plugin design alignment */
/* Shared --t2-plugin-* tokens are owned by css/t2-foundation.css. */
.t2-dsc-service-brand {

  letter-spacing: -0.01em;
}
.t2-product-brand { white-space: nowrap; }

.t2-code-block {
  color: var(--t2-plugin-text); background: var(--t2-plugin-surface-muted); border: 1px solid var(--t2-plugin-border);
  border-radius: var(--t2-plugin-radius-island); box-shadow: none;
}
.t2-code-block > div:first-child { border-bottom: 1px solid var(--t2-plugin-border); color: var(--t2-plugin-text-muted); font-weight: 700; }
.t2-code-block pre, .t2-code-block code { color: var(--t2-plugin-text); background: transparent; } .t2-code-block .code-placeholder:focus-visible { outline: 1px solid var(--t2-plugin-product); outline-offset: 2px; }

/* =========================================================================
   T2Editor /law 706 — plugin scroll and native-control hardening
   ========================================================================= */
:is([class^="t2-code-"], [class*=" t2-code-"]):not([data-t2-modal-surface]) {
  max-width: 100%;
}
:is(:is([class^="t2-code-"], [class*=" t2-code-"]) :is(button, input, textarea, select), button[class^="t2-code-"], button[class*=" t2-code-"], input[class^="t2-code-"], input[class*=" t2-code-"], textarea[class^="t2-code-"], textarea[class*=" t2-code-"], select[class^="t2-code-"], select[class*=" t2-code-"]) {
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}
:is(:is([class^="t2-code-"], [class*=" t2-code-"]) button, button[class^="t2-code-"], button[class*=" t2-code-"]) {
  -webkit-appearance: none;
  appearance: none;
}
:is(:is([class^="t2-code-"], [class*=" t2-code-"]) :is(input:not([type]), input[type="text"], input[type="search"], input[type="email"], input[type="url"], input[type="tel"], input[type="number"], input[type="password"], textarea, select), input:not([type])[class^="t2-code-"], input:not([type])[class*=" t2-code-"], input[type="text"][class^="t2-code-"], input[type="text"][class*=" t2-code-"], input[type="search"][class^="t2-code-"], input[type="search"][class*=" t2-code-"], input[type="email"][class^="t2-code-"], input[type="email"][class*=" t2-code-"], input[type="url"][class^="t2-code-"], input[type="url"][class*=" t2-code-"], input[type="tel"][class^="t2-code-"], input[type="tel"][class*=" t2-code-"], input[type="number"][class^="t2-code-"], input[type="number"][class*=" t2-code-"], input[type="password"][class^="t2-code-"], input[type="password"][class*=" t2-code-"], textarea[class^="t2-code-"], textarea[class*=" t2-code-"], select[class^="t2-code-"], select[class*=" t2-code-"]) {
  -webkit-appearance: none;
  appearance: none;
  box-shadow: none;
}
:is(:is([class^="t2-code-"], [class*=" t2-code-"]) :is(button, input, textarea, select), button[class^="t2-code-"], button[class*=" t2-code-"], input[class^="t2-code-"], input[class*=" t2-code-"], textarea[class^="t2-code-"], textarea[class*=" t2-code-"], select[class^="t2-code-"], select[class*=" t2-code-"]):focus {
  outline: none;
}
:is(:is([class^="t2-code-"], [class*=" t2-code-"]) :is(button, input, textarea, select), button[class^="t2-code-"], button[class*=" t2-code-"], input[class^="t2-code-"], input[class*=" t2-code-"], textarea[class^="t2-code-"], textarea[class*=" t2-code-"], select[class^="t2-code-"], select[class*=" t2-code-"]):focus-visible {
  outline: 1px solid var(--t2-plugin-product, var(--t2-product));
  outline-offset: 2px;

}

.t2-code-block pre{
  max-width: 100%;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: none;
  touch-action: pan-x pinch-zoom;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.t2-code-block pre::-webkit-scrollbar{
  width: 0;
  height: 0;
  display: none;
}

/* T2Editor /law 706 — plugin select indicator after native appearance reset */
:is(:is([class^="t2-code-"], [class*=" t2-code-"]) select, select[class^="t2-code-"], select[class*=" t2-code-"]):not([multiple]):not([size]) {
  padding-inline-end: max(32px, 2.25em);
  background: var(--t2-surface);
  background-position:
    calc(100% - 14px) calc(50% - 1px),
    calc(100% - 9px) calc(50% - 1px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
/* Custom drag surfaces own pointer movement and must not trigger native text/image selection. */
:where([data-t2-drag-surface], [draggable="true"], input[type="range"], [role="slider"],
  [class*="drag-handle"], [class*="resize-handle"], [class*="resizer"],
  [class*="crop-handle"], [class*="trim-handle"], [class*="seek-bar"],
  [class*="slider-thumb"], [class*="range-thumb"]) {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
:where([data-t2-drag-surface], [draggable="true"], input[type="range"], [role="slider"],
  [class*="drag-handle"], [class*="resize-handle"], [class*="resizer"],
  [class*="crop-handle"], [class*="trim-handle"], [class*="seek-bar"],
  [class*="slider-thumb"], [class*="range-thumb"]) img {
  -webkit-user-drag: none;
  user-drag: none;
  pointer-events: none;
}
html.t2-drag-selection-active, html.t2-drag-selection-active body {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

}