.service-overlay { z-index: 1200; }
.service-overlay.admin-modal, .service-overlay.message-detail-modal { overflow: clip; }
.service-panel .service-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 16px; border-bottom: 1px solid #dce9eb; }
.service-panel .service-header small { color: #007d83; font-size: 12px; }
.service-panel .service-header h2 { font-size: 19px; line-height: 28px; margin: 6px 0 0; }
.service-panel .service-close { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; padding: 0; border: 1px solid #dce9eb; border-radius: 8px; color: #536d76; background: #f4f8f8; }
.service-panel .service-close svg { width: 20px; height: 20px; }
.service-panel .service-meta { font-size: 12px; line-height: 20px; color: #637d84; margin: 14px 0; }
.service-panel .service-note { padding: 12px; border-radius: 8px; background: #eff9f8; color: #405e68; font-size: 13px; line-height: 22px; margin: 12px 0 18px; }
.service-panel .service-related-action { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; margin: 0 0 18px; padding: 10px 14px; border: 1px solid #8dd8d4; border-radius: 8px; background: #effaf9; color: #007d83; font: inherit; font-size: 14px; font-weight: 650; cursor: pointer; }
.service-panel .service-related-action:hover { background: #e1f6f4; border-color: #18c7c5; }
.service-panel .service-form, .service-panel fieldset { display: grid; gap: 16px; min-width: 0; margin: 0; padding: 0; border: 0; }
.service-panel .service-form label:not(.service-toggle) { display: block; color: #405e68; font-size: 14px; line-height: 24px; }
.service-panel .service-form :is(input:not([type="checkbox"]),textarea) { display: block; box-sizing: border-box; width: 100%; margin-top: 8px; }
.service-panel .service-form input[type="file"] { font-size: 12px; padding: 12px 0; }
.service-panel .service-form input[type="file"]::file-selector-button { padding: 9px 12px; margin-right: 10px; color: #007d83; border: 1px solid #afe4e2; border-radius: 8px; background: #ecfbfa; }
.service-panel .service-form textarea { min-height: 240px; line-height: 1.8; }
.service-panel em { color: #d52c48; font-style: normal; }
.service-panel .service-muted { color: #637d84; font-size: 12px; line-height: 21px; margin: 0; }
.service-panel .service-toggle { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 52px; border-bottom: 1px solid #e6eeee; font-size: 14px; }
.service-panel .service-toggle > span { display: grid; min-width: 0; gap: 4px; padding: 8px 0; }
.service-panel .service-toggle small { color: #637d84; font-size: 12px; line-height: 21px; }
.service-panel .service-toggle input { appearance: none; position: relative; flex: 0 0 42px; width: 42px; height: 24px; padding: 0; margin: 0; border: 1px solid #aabfc3; border-radius: 20px; background: #d3dfe1; cursor: pointer; }
.service-panel .service-toggle input::after { content: ''; display: block; width: 18px; height: 18px; position: absolute; left: 2px; top: 2px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px #0b2e3a26; }
.service-panel .service-toggle input:checked { background: #00868d; border-color: #00868d; }
.service-panel .service-toggle input:checked::after { left: 20px; }
.service-panel .service-channel { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: #637d84; padding: 12px 0; }
.service-panel .service-copyright-enabled > span { display: grid; gap: 2px; }
.service-panel .service-copyright-enabled b { color: #0b2e3a; font-size: 14px; }
.service-panel .service-copyright-enabled small { color: #637d84; font-size: 11px; line-height: 18px; }
.service-panel .service-copyright-section { display: grid; gap: 10px; }
.service-panel .service-copyright-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.service-panel .service-copyright-heading > div { display: grid; gap: 3px; min-width: 0; }
.service-panel .service-copyright-heading strong { color: #0b2e3a; font-size: 14px; }
.service-panel .service-copyright-heading small { color: #637d84; font-size: 11px; line-height: 18px; }
.service-panel .service-copyright-heading button { flex: 0 0 auto; min-height: 38px; padding: 7px 10px; }
.service-panel .service-copyright-link-list { display: grid; gap: 0; border-top: 1px solid #dce9eb; }
.service-panel .service-copyright-link-row { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); gap: 10px; padding: 14px 42px 14px 0; border-bottom: 1px solid #dce9eb; }
.service-panel .service-copyright-link-row [data-copyright-url] { grid-column: 1 / -1; }
.service-panel .service-copyright-link-row select { display: block; width: 100%; min-height: 42px; margin-top: 8px; }
.service-panel .service-copyright-remove { position: absolute; top: 36px; right: 0; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid #efc7cf; border-radius: 6px; background: #fff5f6; color: #b3263c; }
.service-panel .service-copyright-remove .ui-icon { width: 17px; height: 17px; }
.service-panel .service-copyright-reading { padding: 18px 4px; text-align: center; }
.service-panel .service-copyright-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px 12px; }
.service-panel .service-copyright-links span { display: inline-flex; align-items: center; gap: 2px; color: #007d83; font-size: 12px; line-height: 20px; }
.service-panel .service-copyright-links .ui-icon { width: 12px; height: 12px; }
.service-panel .service-copyright-lines { display: grid; gap: 3px; margin-top: 8px; }
.service-panel .service-copyright-lines p { margin: 0; color: #465f68; font-size: 12px; line-height: 20px; overflow-wrap: anywhere; }
.service-panel .service-copyright-empty { padding: 28px 10px; color: #637d84; font-size: 12px; text-align: center; }
.service-panel .service-error { color: #b3263c; font-size: 13px; line-height: 22px; margin: 0; }
.service-panel .service-error:empty { display: none; }
.service-panel .service-save, .service-panel .service-secondary { min-height: 46px; padding: 11px 14px; border-radius: 8px; font: inherit; font-size: 14px; line-height: 22px; font-weight: 600; border: 1px solid #cddfe2; background: #f8fbfb; color: #0b2e3a; }
.service-panel .service-save { border-color: #18c7c5; background: #18c7c5; }
.service-panel button:disabled { opacity: .55; cursor: not-allowed; }
.service-panel :is(button,input,a,textarea):focus-visible { outline: 2px solid #00868d; outline-offset: 3px; }
.service-panel .service-contact { text-align: center; padding: 14px 0; }
.service-panel .service-contact > span { color: #637d84; font-size: 13px; }
.service-panel .service-phone { display: block; margin: 12px 0 24px; color: #007d83; font-size: 24px; font-weight: 650; line-height: 36px; overflow-wrap: anywhere; text-decoration: none; }
.service-panel .service-contact h3 { font-size: 15px; margin: 16px 0; }
.service-panel .service-qr { display: block; width: 200px; height: 200px; max-width: 100%; object-fit: contain; background: #fff; padding: 8px; box-sizing: border-box; margin: 12px auto; }
.service-panel .service-document { font-size: 14px; line-height: 1.9; white-space: pre-wrap; overflow-wrap: anywhere; color: #294b57; padding: 4px 0 12px; }
.service-panel .service-preview { padding: 16px 0; border-top: 1px solid #dce9eb; border-bottom: 1px solid #dce9eb; }
.service-panel [hidden] { display: none; }
.service-overlay .service-panel { display: flex; flex-direction: column; min-height: 0; max-height: calc(var(--h5-modal-height, 100dvh) - 32px); overflow: clip; }
.service-panel .service-header { flex-shrink: 0; }
.service-panel .service-body { min-height: 0; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; scrollbar-width: thin; padding-right: 8px; }
.service-panel .service-policy-status { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; margin: 16px 0; color: #637d84; font-size: 12px; }
.service-panel .service-draft-badge { color: #85531a; background: #fff5e5; padding: 5px 8px; border-radius: 4px; }
.service-panel .service-policy-tabs { position: sticky; top: 0; z-index: 1; display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 0 12px; background: #fff; border-bottom: 1px solid #dce9eb; margin-bottom: 16px; }
.service-panel .service-policy-tabs button { flex: 1; min-height: 44px; border: 1px solid #dce9eb; border-radius: 4px; background: #f8fbfb; color: #405e68; padding: 8px; font: inherit; font-size: 13px; }
.service-panel .service-policy-tabs [aria-pressed="true"] { background: #e8f8f6; color: #006970; border-color: #76c9c5; font-weight: 600; }
.service-panel .service-policy-form select { display: block; width: 100%; margin-top: 8px; }
.service-panel .service-policy-form textarea { min-height: 360px; resize: vertical; font-size: 14px; line-height: 1.9; }
.service-panel .service-rich-editor-label { color: #405e68; font-size: 14px; line-height: 24px; }
.service-panel .service-rich-editor { min-width: 0; width: 100%; margin-top: 8px; }
.service-panel .jodit-container:not(.jodit_inline) { width: 100% !important; max-width: 100%; min-width: 0; border-color: #cddfe2; border-radius: 6px; overflow: hidden; box-shadow: none; }
.service-panel .jodit-container.service-editor-disabled { pointer-events: none; opacity: .72; }
.service-panel .jodit-toolbar__box { position: sticky; top: 0; z-index: 2; border-color: #dce9eb; background: #f8fbfb; }
.service-panel .jodit-toolbar-editor-collection { flex-wrap: wrap !important; }
.service-panel .jodit-toolbar-button { flex: 0 0 auto; }
.service-panel .jodit-workplace { min-height: 360px !important; border-color: #dce9eb; }
.service-panel .jodit-wysiwyg { min-height: 360px !important; padding: 16px; color: #294b57; font-size: 14px; line-height: 1.9; overflow-wrap: anywhere; }
.service-panel .jodit-wysiwyg table { width: 100%; max-width: 100%; border-collapse: collapse; }
.service-panel .jodit-wysiwyg :is(th,td) { min-width: 44px; padding: 8px; border: 1px solid #cddfe2; }
.service-panel .jodit-status-bar { min-height: 30px; border-color: #dce9eb; color: #637d84; }
.service-panel .jodit-powered-by { display: none; }
.service-panel .service-policy-issues { color: #81511e; border-left: 3px solid #ddb672; padding-left: 10px; font-size: 12px; line-height: 21px; margin: 0; }
.service-panel .service-policy-review { border: 1px solid #ead8b7; border-radius: 6px; background: #fffaf1; padding: 0 12px; }
.service-panel .service-policy-review summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; color: #714817; cursor: pointer; font-size: 13px; font-weight: 600; }
.service-panel .service-policy-review summary strong { flex: 0 0 auto; color: #9a5c16; font-size: 12px; }
.service-panel .service-policy-review ol { display: grid; gap: 4px; margin: 0 0 12px; padding: 0 0 0 22px; }
.service-panel .service-policy-review li { color: #9a5c16; font-size: 12px; }
.service-panel .service-policy-review button { width: 100%; min-height: 36px; padding: 7px 4px; border: 0; border-bottom: 1px solid #f0e3cc; background: transparent; color: #5f4a31; font: inherit; font-size: 12px; line-height: 20px; text-align: left; overflow-wrap: anywhere; }
.service-panel .service-policy-review li:last-child button { border-bottom: 0; }
.service-panel .service-policy-actions { display: grid; gap: 12px; padding: 16px 0 8px; border-top: 1px solid #dce9eb; }
.service-panel .service-form label.service-review-confirm { display: flex; align-items: flex-start; gap: 8px; color: #536d76; font-size: 12px; line-height: 21px; }
.service-panel .service-review-confirm input { flex-shrink: 0; width: 18px; height: 18px; margin: 2px 0 0; accent-color: #00868d; }
.service-panel .service-publish-blocked:not(:disabled) { border-color: #d5ae6b; background: #fffaf1; color: #714817; }
.service-panel .service-toc { border-bottom: 1px solid #dce9eb; padding-bottom: 14px; margin-bottom: 18px; }
.service-panel .service-toc summary { color: #007d83; font-size: 14px; font-weight: 600; cursor: pointer; min-height: 32px; line-height: 32px; }
.service-panel .service-toc nav { display: grid; gap: 2px; margin-top: 8px; }
.service-panel .service-toc button { text-align: left; padding: 9px 4px; min-height: 40px; background: transparent; border: 0; border-bottom: 1px solid #eef3f3; color: #405e68; font: inherit; font-size: 13px; line-height: 22px; }
.service-panel .service-markdown { white-space: normal; font-size: 14px; line-height: 1.95; overflow-wrap: anywhere; line-break: strict; }
.service-panel .service-markdown * { box-sizing: border-box; max-width: 100%; letter-spacing: 0; }
.service-panel .service-markdown h1 { margin: 0 0 20px; color: #0b2e3a; font-size: 22px; line-height: 1.5; }
.service-panel .service-markdown h2 { margin: 30px 0 14px; padding-bottom: 9px; border-bottom: 1px solid #cde4e2; color: #006c73; font-size: 17px; line-height: 1.65; scroll-margin-top: 76px; }
.service-panel .service-markdown h3 { margin: 20px 0 9px; font-size: 15px; line-height: 1.7; color: #24424d; scroll-margin-top: 76px; }
.service-panel .service-markdown p { margin: 0 0 14px; font-size: inherit; line-height: inherit; color: inherit; }
.service-panel .service-markdown strong { color: #153f49; font-weight: 650; }
.service-panel .service-markdown :is(ul,ol) { margin: 10px 0 18px; padding-left: 22px; }
.service-panel .service-markdown li { margin: 8px 0; padding-left: 2px; }
.service-panel .service-markdown blockquote { margin: 0 0 20px; padding: 12px 14px; border-left: 3px solid #d4ae69; background: #fff9ef; color: #755326; font-size: 13px; }
.service-panel .service-markdown blockquote p:last-child { margin-bottom: 0; }
.service-panel .service-markdown hr { border: 0; border-top: 1px solid #dce9eb; margin: 24px 0; }
.service-panel .service-markdown code { font-size: 12px; background: #f1f6f6; padding: 2px 3px; overflow-wrap: anywhere; white-space: pre-wrap; }
.service-panel .service-markdown pre { white-space: pre-wrap; padding: 12px; background: #f1f6f6; }
/* The H5 document uses stacked table rows, retaining column labels on narrow screens. */
.service-panel .service-markdown table { display: block; width: 100%; margin: 18px 0 24px; border-collapse: collapse; }
.service-panel .service-markdown thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.service-panel .service-markdown tbody { display: block; }
.service-panel .service-markdown tr { display: block; padding: 12px 0; border-bottom: 1px solid #dce9eb; }
.service-panel .service-markdown td { display: grid; grid-template-columns: minmax(0, 84px) minmax(0, 1fr); gap: 12px; border: 0; padding: 7px 0; font-size: 13px; line-height: 1.8; }
.service-panel .service-markdown td::before { content: attr(data-label); font-weight: 600; color: #607980; }
.service-panel .service-cell-value { min-width: 0; }
.service-panel .service-markdown .service-table-header-row { font-weight: 650; color: #153f49; background: #f1f8f8; }

@media (max-width: 380px) {
  .service-panel .jodit-wysiwyg { padding: 12px; }
  .service-panel .jodit-toolbar-button__button { min-width: 30px; min-height: 30px; }
}

@media (max-width: 448px) {
  .jodit-popup-container > .jodit-popup {
    box-sizing: border-box;
    left: 16px !important;
    right: 16px !important;
    top: auto !important;
    bottom: max(16px, env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - 32px);
    overflow: auto;
  }
  .jodit-popup-container > .jodit-popup .jodit-popup__content { max-width: 100%; overflow: auto; }
}