/* /var/www/html/y/yyy__theme_style.css */
/* =========================================

  파일: yyy__theme_style.css
  최종 작성: 2026년 2월 15일 일요일 오후 12:14
   1) 테마 변수 (Light)
   ========================================= */
:root{
  --bg:#f3f4f6;
  --text:#111;
  --panel:#ffffff;
  --panel2:#f8f9fa;
  --border:#dcdcdc;
  --link:#0d6efd;
  --input-bg:#fff;
  --input-text:#111;

  --accent:#007bff;
  --shadow:0 2px 10px rgba(0,0,0,0.1);

  --match-bg:#fff3cd;
  --match-text:#111;

  --bs-highlight-bg:#ffeb3b;
  --bs-highlight-color:#000;
}

/* =========================================
   2) 테마 변수 (Dark)  ※ BS5.3 표준
   ========================================= */
html[data-bs-theme="dark"]{
  --bg:#141414;
  --text:#eaeaea;
  --panel:#1f1f1f;
  --panel2:#252525;
  --border:#3a3a3a;
  --link:#4ea1ff;
  --input-bg:#1a1a1a;
  --input-text:#f0f0f0;

  --match-bg:#2f2714;
  --match-text:#a8a800;
}

/* =========================================
   3) 전역 기본
   ========================================= */
body{
  font-family: Arial;
  margin: 20px;
  background:var(--bg);
  color:var(--text);
}

a, a:hover, a:focus, a:visited { text-decoration: none; }
a{ color:var(--link); }

mark{
  background: var(--bs-highlight-bg);
  color: var(--bs-highlight-color);
}

html[data-bs-theme="dark"] mark{
  background: rgba(255, 193, 7, 0.7);
  color: #fff3bf;
}

/* =========================================
   4) 토글 UI
   ========================================= */
.darkmode-switch{position:relative;width:46px;height:20px;display:inline-block}
.darkmode-switch input{display:none}
.darkmode-slider{
  position:absolute;inset:0;
  background:#ccc;border-radius:20px;transition:.3s
}
.darkmode-slider:before{
  content:"";position:absolute;
  width:14px;height:14px;left:3px;bottom:3px;
  background:#fff;border-radius:50%;transition:.3s
}
input:checked + .darkmode-slider{background:#2196F3}
input:checked + .darkmode-slider:before{transform:translateX(26px)}
.darkmode-label{font-size:12px;opacity:.8;cursor:pointer}
.pointer{cursor: pointer;}

/* =========================================
   5) 레이아웃 공통
   ========================================= */
.container.main-wrapper{
  max-widthXXX:  1400px;
  min-width: 375px;  
  margin: 0 auto;
}
.result-area{ width:100%; }

/* =========================================
   6) 패널/폼/결과 UI
   ========================================= */
.container{
  background: var(--panel);
  padding: 20px;
  border-radius: 8px;
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
}

.find-form{
  background: var(--panel2);
  padding: 15px;
  border-radius: 5px;
  margin-bottom: 20px;
  border: 1px solid var(--border);
}

.file-result{
  margin: 10px 0;
  padding: 10px;
  background: var(--panel);
  border-left: 4px solid var(--accent, #007bff);
  border: 1px solid var(--border);
}

.file-path{
  color: var(--link);
  text-decoration: none;
  font-weight: bold;
  font-size: 14px;
  cursor: pointer;
}
.file-path:hover{ text-decoration: underline; }

.match-line{
  background: var(--match-bg, #fff3cd);
  color: var(--match-text, #111);
  padding: 5px;
  margin: 2px 0;
  border-radius: 3px;
  border: 1px solid var(--border);
}

.line-num{ color: #999; margin-right: 10px; }

html[data-bs-theme="dark"] .match-line{
  background: #2f2714;
  color: #a8a800;
  border-color: #5a4a25;
}

/* =========================================
   7) 버튼/상태 스타일
   ========================================= */
.copy-btn{
  background: #28a745;
  color: white;
  padding: 3px 8px;
  margin-left: 10px;
  border: none;
  border-radius: 3px;
  font-size: 11px;
  cursor: pointer;
}

.editable-success{
  border: 2px solid #198754 !important;
  background-color: #d1e7dd;
}
.editable-danger{
  border: 2px solid #dc3545 !important;
  background-color: #f8d7da;
}
html[data-bs-theme="dark"] .editable-success{ background-color: #0f2f22; }
html[data-bs-theme="dark"] .editable-danger{ background-color: #3b161a; }

.bulk-form{
  background: #e3f2fd;
  padding: 15px;
  margin: 15px 0;
  border-radius: 5px;
  border: 2px solid #2196f3;
}
html[data-bs-theme="dark"] .bulk-form{
  background: #112433;
  border-color: #2196f3;
}

input,select{
  padding: 8px;
  margin: 0px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--input-bg);
  color: var(--input-text);
}

button:not(.btn){
  backgroundX: #007bff;
  colorX: white;
  padding: 8px 15px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.box { border: 1px solid red; }
.SeroBar{ color: #f04e00; padding-left: 10px; }
label{ white-space: nowrap; }
#eXtInput{ width: 210px; }

.tooltip {
  --bs-tooltip-zindex: 6000;
  z-index: 6000 !important;
}

/* =========================================
   8) YW v007 Toast / CodeMirror 보정
   ========================================= */
.yy-toast-wrap{
  position:fixed;
  right:16px;
  z-index:200000;
  display:flex;
  flex-direction:column;
  gap:8px;
  pointer-events:none;
}
.yy-toast-wrap > div{ pointer-events:auto; }
.yy-toast-top-right{ top:76px; bottom:auto; }
.yy-toast-center{
  left:50%; top:42%; right:auto;
  transform:translate(-50%,-50%);
  align-items:center;
}

.CodeMirror{
  background:var(--input-bg) !important;
  color:var(--input-text) !important;
}
html[data-bs-theme="light"] .CodeMirror,
html:not([data-bs-theme="dark"]) .CodeMirror{
  background:#fff !important;
  color:#111 !important;
}
html[data-bs-theme="light"] .CodeMirror-gutters,
html:not([data-bs-theme="dark"]) .CodeMirror-gutters{
  background:#f3f4f6 !important;
  border-right:1px solid #dcdcdc !important;
}
html[data-bs-theme="light"] .CodeMirror-linenumber,
html:not([data-bs-theme="dark"]) .CodeMirror-linenumber{ color:#777 !important; }
html[data-bs-theme="dark"] .CodeMirror{
  background:#1f2329 !important;
  color:#e6edf3 !important;
}
html[data-bs-theme="dark"] .CodeMirror-gutters{
  background:#171b21 !important;
  border-right:1px solid #343a40 !important;
}
html[data-bs-theme="dark"] .CodeMirror-linenumber{ color:#8b949e !important; }