/* iToolsera Regex Tester & Debugger v1.0.0 */
.regex-tool { max-width: 1180px; margin: 0 auto; }
.regex-card { background:#fff; border:1px solid #e2e8f0; border-radius:16px; box-shadow:0 8px 28px rgba(15,23,42,.06); padding:24px; }
.regex-card-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:24px; }
.regex-kicker { display:inline-block; margin-bottom:6px; font-size:.76rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#2563eb; }
.regex-panel, .regex-replacement-card, .regex-details-card { border:1px solid #e2e8f0; border-radius:12px; background:#fff; padding:18px; }
.regex-pattern-section { border:1px solid #e2e8f0; border-radius:12px; padding:18px; background:#f8fafc; }
.regex-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.regex-pattern-input, .regex-test-editor, #regexReplacement { font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; }
.regex-pattern-input { font-size:1rem; min-height:48px; }
.regex-test-editor { min-height:320px; resize:vertical; white-space:pre; line-height:1.55; }
.regex-flags { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.regex-flags-label { font-weight:600; margin-right:4px; }
.regex-flag-option { position:relative; display:inline-flex; align-items:center; margin:0; cursor:pointer; }
.regex-flag-option input { position:absolute; opacity:0; pointer-events:none; }
.regex-flag-option span { min-width:38px; padding:6px 10px; text-align:center; border:1px solid #cbd5e1; border-radius:8px; background:#fff; color:#334155; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-weight:700; }
.regex-flag-option input:checked + span { border-color:#2563eb; background:#eff6ff; color:#1d4ed8; box-shadow:0 0 0 2px rgba(37,99,235,.08); }
.regex-flag-option input:focus-visible + span { outline:2px solid #2563eb; outline-offset:2px; }
.regex-action-bar { display:flex; flex-wrap:wrap; gap:8px; }
.regex-highlight-output { min-height:320px; max-height:480px; overflow:auto; padding:14px; border:1px solid #e2e8f0; border-radius:8px; background:#f8fafc; font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; font-size:.9rem; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere; }
.regex-highlight-text { min-height:288px; }
.regex-match-highlight { background:#fde68a; color:#1e293b; border-radius:3px; padding:1px 2px; box-shadow:0 0 0 1px rgba(245,158,11,.15); }
.regex-empty-state { min-height:288px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:#64748b; }
.regex-empty-state i { font-size:1.5rem; margin-bottom:10px; color:#94a3b8; }
.regex-empty-state.compact { min-height:100px; }
.regex-empty-state.compact p { color:#64748b; }
.regex-details-card { background:#f8fafc; }
.regex-match-item { border:1px solid #e2e8f0; border-radius:10px; background:#fff; padding:15px; margin-bottom:12px; }
.regex-match-item:last-child { margin-bottom:0; }
.regex-match-item-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.regex-match-item-header span { font-size:.8rem; color:#64748b; }
.regex-match-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:10px; }
.regex-match-grid > div, .regex-groups { border:1px solid #e2e8f0; border-radius:8px; padding:10px; background:#f8fafc; }
.regex-detail-label { display:block; margin-bottom:5px; font-size:.72rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#64748b; }
.regex-match-grid code, .regex-group-row code { white-space:pre-wrap; overflow-wrap:anywhere; color:#0f172a; }
.regex-groups { margin-top:10px; }
.regex-group-row { display:grid; grid-template-columns:160px 1fr; gap:10px; padding:8px 0; border-bottom:1px solid #e2e8f0; }
.regex-group-row:last-child { border-bottom:0; }
.regex-replacement-output { min-height:100px; max-height:320px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; padding:14px; border:1px solid #e2e8f0; border-radius:8px; background:#f8fafc; color:#0f172a; font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; line-height:1.6; }
.regex-replacement-output.regex-replacement-has-result { color:#0f172a; }
.regex-replacement-output[data-empty-result="true"]::before { content:"(empty replacement result)"; color:#64748b; font-style:italic; }
.regex-replacement-result-label { font-size:.78rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:#64748b; }
.regex-limit-note { padding:10px 12px; border-radius:8px; background:#f8fafc; border:1px solid #e2e8f0; color:#64748b; font-size:.8rem; }
.regex-error-details { margin-top:7px; white-space:pre-wrap; font-size:.86rem; }
.regex-card .alert { margin-bottom:18px; }

@media (max-width: 991.98px) {
  .regex-match-grid { grid-template-columns:1fr; }
  .regex-test-editor, .regex-highlight-output { min-height:260px; }
  .regex-card { padding:18px; }
}

@media (max-width: 575.98px) {
  .regex-card-header { flex-direction:column; }
  .regex-action-bar .btn { flex:1 1 calc(50% - 8px); }
  .regex-action-bar .btn-indigo { flex-basis:100%; }
  .regex-group-row { grid-template-columns:1fr; gap:4px; }
  .input-group { display:block; }
  .input-group .form-control { border-radius:.25rem !important; }
  .input-group-append { margin-top:8px; }
  .input-group-append .btn { width:100%; border-radius:.25rem !important; }
}