/* MADO SUPPORT INBOX PAGE CSS SSOT CLEAN BUILD 2026-07-11
 * Provider only: public/css/support-inbox-page.css
 * Current sources: includes/portal/support-inbox-page.php (inbox view)
 * and public/js/support-inbox.js.
 * Removed: operation-settings ownership, obsolete ticket-admin branches,
 * repeated selector definitions, and legacy migration residue.
 * Shared inbox primitives remain owned by public/css/mado-base.css.
 */

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-portal-shell__content-frame.is-standard {

    box-sizing: border-box;
    width: 100%;
    max-width: var(--mado-portal-page-wide-max-width, 1240px);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--mado-portal-page-gutter-x, clamp(18px, 2.4vw, 32px));
    padding-right: var(--mado-portal-page-gutter-x, clamp(18px, 2.4vw, 32px));

}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-portal-container {

    box-sizing: border-box;
    width: 100%;
    min-width: 0;

}

body.mado-admin-window-standalone .mado-support-internal-save-button,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox.is-support-ticket-detail-view .mado-support-internal-save-button {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    border: 0;
    border-radius: 999px;
    background: #18c7a0;
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: none;
    text-shadow: none;
    cursor: pointer;

}

body.mado-admin-window-standalone .mado-support-internal-save-button:hover,
body.mado-admin-window-standalone .mado-support-internal-save-button:focus-visible,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox.is-support-ticket-detail-view .mado-support-internal-save-button:hover,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox.is-support-ticket-detail-view .mado-support-internal-save-button:focus-visible {

    background: #10a987;
    color: #ffffff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(24, 199, 160, 0.18);

}

.mado-portal-container .mado-inbox-board {

    --mado-inbox-list-action: #0798a7;
    --mado-inbox-list-action-hover: #087682;
    --mado-inbox-download-action: #18c7a0;
    --mado-inbox-download-action-hover: #10a987;
    --mado-support-inbox-base-font-size: 15px;
    --mado-support-ui-font-13: 13px;
    /* Reply/status button color SSOT / 返信・状態ボタン色の正本（2026-08-12） */
    --mado-support-tool-primary-border: #38bdf8;
    --mado-support-tool-primary-bg: #e0f2fe;
    --mado-support-tool-primary-text: #075985;
    --mado-support-tool-outline-border: #111827;
    --mado-support-tool-outline-bg: #ffffff;
    --mado-support-tool-outline-text: #111827;
    --mado-support-tool-outline-hover-bg: #f8fafc;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 24px;
    margin-bottom: 24px;

}

.mado-portal-container .mado-inbox-board__header {

    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;

}

.mado-portal-container .mado-inbox-board__title {

    margin: 0;

}

/*
 * HUMAN WAITING COUNT / 有人返答待ち人数（2026-08-30）
 * - 未対応filter chipとは別指標。anonymous_improvementはPHP側READで除外する。
 * - 画面右上の運用確認用表示だけを担当し、件数計算や保存責任をCSS/JSへ持たせない。
 */
.mado-portal-container .mado-inbox-waiting-status {

    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    min-height: 34px;
    padding: 6px 12px;
    border: 1px solid #d8e3ed;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;

}

.mado-portal-container .mado-inbox-waiting-status__count {

    color: #0f2440;
    font-size: 20px;
    font-weight: 800;
    line-height: 1;

}

.mado-portal-container .mado-inbox-waiting-status__suffix {

    color: #334155;

}

.mado-portal-container .mado-inbox-filter-row {

    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;

}

.mado-portal-container .mado-inbox-filter-chip {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 4px 13px;
    border: 1px solid #c8d6e5;
    border-radius: 999px;
    background: #ffffff;
    color: #243447;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.15;
    text-decoration: none;
    white-space: nowrap;

}

.mado-portal-container .mado-inbox-filter-chip--active {

    background: #0f2440;
    border-color: #0f2440;
    color: #ffffff;

}

.mado-portal-container .mado-support-toolbar {

    display: grid;
    gap: 0;
    margin-bottom: 16px;
    border: 1px solid #d8e3ed;
    border-radius: 16px;
    background: #ffffff;
    overflow: hidden;

}

.mado-portal-container .mado-support-toolbar__primary {

    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    min-width: 0;

}

.mado-portal-container .mado-support-toolbar__section {

    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 10px 14px;
    box-sizing: border-box;

}

.mado-portal-container .mado-support-toolbar__section + .mado-support-toolbar__section,
.mado-portal-container .mado-support-box-tabs {

    border-left: 1px solid #dfe7ef;

}

.mado-portal-container .mado-support-toolbar__section--search {

    flex: 1 1 430px;

}

.mado-portal-container .mado-support-toolbar__section--display {

    flex: 0 0 auto;

}

.mado-portal-container .mado-support-search-form {

    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;

}

.mado-portal-container .mado-support-search-form__field {

    flex: 1 1 220px;
    min-width: 160px;

}

.mado-portal-container .mado-support-search-form__field input[type="search"] {

    width: 100%;
    min-height: 36px;
    padding: 7px 12px;
    border: 1px solid #cad7e3;
    border-radius: 10px;
    background: #ffffff;
    color: #10202f;
    font-size: var(--mado-support-ui-font-13);
    line-height: 1.3;
    box-shadow: none;

}

.mado-portal-container .mado-support-search-form__field input[type="search"]:focus {

    border-color: #2eb2c1;
    outline: 2px solid rgba(46, 178, 193, 0.16);
    outline-offset: 0;

}

.mado-portal-container .mado-support-search-form__submit.button,
.mado-portal-container .mado-support-condition-panel__submit.button {

    min-height: 36px;
    padding: 7px 15px;
    border: 1px solid #0f172a;
    border-radius: 10px;
    background: #0f172a;
    color: #ffffff;
    font-size: var(--mado-support-ui-font-13);
    font-weight: 700;
    line-height: 1.2;
    box-shadow: none;
    text-shadow: none;

}

.mado-portal-container .mado-support-search-form__conditions.button {

    min-height: 36px;
    padding: 7px 13px;
    border: 1px solid #d3c9df;
    border-radius: 10px;
    background: #f4eff8;
    color: #283645;
    font-size: var(--mado-support-ui-font-13);
    font-weight: 700;
    line-height: 1.2;
    box-shadow: none;

}

.mado-portal-container .mado-support-search-form__conditions.button:hover,
.mado-portal-container .mado-support-search-form__conditions.button:focus,
.mado-portal-container .mado-support-search-form__conditions.button.is-active {

    border-color: #0f172a;
    background: #ffffff;
    color: #0f172a;

}

.mado-portal-container .mado-support-page-size {

    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #637282;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;

}

.mado-portal-container .mado-support-page-size__select {

    min-width: 78px;
    min-height: 36px;
    padding: 6px 30px 6px 12px;
    border: 1px solid #cad7e3;
    border-radius: 10px;
    background-color: #ffffff;
    color: #10202f;
    font-size: var(--mado-support-ui-font-13);
    font-weight: 700;
    line-height: 1.2;

}

.mado-portal-container .mado-support-font-scale {

    display: inline-grid;
    grid-template-columns: 34px 56px 34px;
    align-items: stretch;
    min-height: 36px;
    border: 1px solid #cad7e3;
    border-radius: 10px;
    overflow: hidden;
    background: #ffffff;

}

.mado-portal-container .mado-support-font-scale__button.button {

    min-width: 34px;
    min-height: 34px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #f8fafc;
    color: #334155;
    font-size: 14px;
    font-weight: 700;
    box-shadow: none;

}

.mado-portal-container .mado-support-font-scale__button.button + .mado-support-font-scale__value,
.mado-portal-container .mado-support-font-scale__value + .mado-support-font-scale__button.button {

    border-left: 1px solid #dbe4ed;

}

.mado-portal-container .mado-support-font-scale__value {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    color: #10202f;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;

}

.mado-portal-container .mado-support-box-tabs {

    display: inline-flex;
    align-items: center;
    gap: 0;
    margin-left: auto;
    padding: 10px 14px;

}

.mado-portal-container .mado-support-box-tab.button,
.mado-portal-container .mado-support-period-filter__link.button {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #10202f;
    font-size: var(--mado-support-ui-font-13);
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    box-shadow: none;
    white-space: nowrap;

}

.mado-portal-container .mado-support-box-tab.button + .mado-support-box-tab.button,
.mado-portal-container .mado-support-period-filter__link.button + .mado-support-period-filter__link.button {

    border-left: 1px solid #12a8b5;

}

.mado-portal-container .mado-support-box-tab.button:hover,
.mado-portal-container .mado-support-box-tab.button:focus,
.mado-portal-container .mado-support-box-tab.button.is-active,
.mado-portal-container .mado-support-period-filter__link.button:hover,
.mado-portal-container .mado-support-period-filter__link.button:focus,
.mado-portal-container .mado-support-period-filter__link.button.is-active {

    background: #eefaff;
    color: #0f5268;

}

.mado-portal-container .mado-support-box-tab--home.button:hover,
.mado-portal-container .mado-support-box-tab--home.button:focus,
.mado-portal-container .mado-support-box-tab--home.button.is-active {

    background: #e6f7fc;
    color: #02749a;

}

.mado-portal-container .mado-support-box-tab--home.button.is-active:hover,
.mado-portal-container .mado-support-box-tab--home.button.is-active:focus {

    background: #dcf2f8;

}

.mado-portal-container .mado-support-condition-panel {

    border-top: 1px solid #cdeaf0;
    border-bottom: 1px solid #cdeaf0;
    background: #f0fbfd;

}

.mado-portal-container .mado-support-condition-panel[hidden] {

    display: none;

}

.mado-portal-container .mado-support-condition-panel__inner {

    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 16px;
    padding: 12px 14px;

}

.mado-portal-container .mado-support-condition-panel__group {

    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;

}

.mado-portal-container .mado-support-condition-panel__label {

    color: #17445a;
    font-size: 12px;
    font-weight: 800;

}

.mado-portal-container .mado-support-condition-panel__field,
.mado-portal-container .mado-support-condition-panel__check {

    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #334155;
    font-size: 12px;
    line-height: 1.3;
    white-space: nowrap;

}

.mado-portal-container .mado-support-condition-panel__field input[type="date"] {

    min-height: 36px;
    padding: 6px 10px;
    border: 1px solid #cad7e3;
    border-radius: 9px;
    background: #ffffff;
    color: #10202f;
    font-size: var(--mado-support-ui-font-13);

}

.mado-portal-container .mado-support-condition-panel__check input[type="checkbox"] {

    width: 15px;
    height: 15px;
    margin: 0;

}

.mado-portal-container .mado-support-toolbar__section--period-export {

    justify-content: space-between;
    flex-wrap: wrap;
    border-top: 1px solid #dfe7ef;

}

.mado-portal-container .mado-support-period-filter,
.mado-portal-container .mado-support-toolbar__export-buttons {

    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;

}

.mado-portal-container .mado-support-export-preset {

    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;

}

.mado-portal-container .mado-support-toolbar__csv.button,
.mado-portal-container .mado-support-toolbar__tsv.button {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 36px;
    padding: 0 16px;
    border: 0;
    border-left: 1px solid #12bda6;
    border-radius: 0;
    background: #f0fbf8;
    color: #0db89d;
    font-size: var(--mado-support-ui-font-13);
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
    text-shadow: none;
    white-space: nowrap;

}

.mado-portal-container .mado-support-toolbar__csv.button + .mado-support-toolbar__tsv.button {

    border-left: 1px solid #12bda6;

}

.mado-portal-container .mado-support-toolbar__csv.button:hover,
.mado-portal-container .mado-support-toolbar__csv.button:focus,
.mado-portal-container .mado-support-toolbar__tsv.button:hover,
.mado-portal-container .mado-support-toolbar__tsv.button:focus {

    background: #dcfbf1;
    color: #07977f;

}

.mado-portal-container .mado-support-toolbar__csv.button:disabled,
.mado-portal-container .mado-support-toolbar__tsv.button:disabled {

    color: #94a3b8;
    border-left-color: #d8e6e2;
    background: #f5faf8;
    opacity: 1;
    cursor: not-allowed;

}

.mado-portal-container .mado-support-download-action__icon {

    display: inline-flex;
    width: 16px;
    height: 16px;
    color: currentColor;
    line-height: 1;
    flex: 0 0 auto;

}

.mado-portal-container .mado-support-download-action__icon svg {

    display: block;
    width: 100%;
    height: 100%;
    fill: currentColor;

}

.mado-portal-container .mado-support-download-action__label {

    display: inline-block;
    line-height: 1;

}

.mado-portal-container .mado-support-toolbar__feedback {

    min-height: 0;
    padding: 0 14px 10px;
    color: #526171;
    font-size: 12px;
    line-height: 1.5;

}

.mado-portal-container .mado-support-toolbar__feedback:empty {

    display: none;

}

.mado-portal-container .mado-support-toolbar__feedback.is-error {

    color: #b42318;

}

.mado-portal-container .mado-inbox-csv-status--error {

    color: #b91c1c;

}

.mado-portal-container .mado-inbox-csv-status--muted {

    color: #64748b;

}

.mado-portal-container .mado-inbox-csv-status--success {

    color: #16a34a;

}

.mado-portal-container .mado-inbox-site-token-missing {

    max-width: 720px;
    padding: 16px;
    border: 1px solid #f59e0b;
    border-radius: 6px;
    background: #fff3cd;

}

.mado-portal-container .mado-inbox-site-token-missing__actions {

    margin-top: 12px;

}

.mado-portal-container .mado-inbox-pagination {

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
    font-size: 13px;
    line-height: 1.35;

}

.mado-portal-container .mado-inbox-pagination__status {

    padding: 4px 10px;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.35;

}

.mado-portal-container .mado-inbox-ticket-card--pending {

    border-left-color: #ce0e3a;
    background: #fff8fb;

}

.mado-portal-container .mado-inbox-ticket-card.fresh-blue {

    border-left-color: #2eb2c1;
    background: rgba(46, 178, 193, 0.18);

}

.mado-portal-container .mado-inbox-ticket-card.fresh-yellow {

    border-left-color: #fcb347;
    background: rgba(252, 179, 71, 0.18);

}

.mado-portal-container .mado-inbox-ticket-card.fresh-red {

    border-left-color: #ce0e3a;
    background: rgba(206, 14, 58, 0.14);

}

.mado-portal-container .mado-inbox-ticket-card.mado-inbox-ticket-card--anonymous-feedback {

    border-left-color: #b8832f;
    background: #fff8e8;

}

.mado-portal-container .mado-inbox-ticket-card.mado-inbox-ticket-card--anonymous-feedback[data-status="resolved"] {

    border-left-color: #a78b5b;
    background: #f5f0e7;

}

.mado-portal-container .mado-inbox-ticket-type-chip {

    display: inline-flex;
    align-items: center;
    min-height: 21px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;

}

.mado-portal-container .mado-inbox-ticket-type-chip--anonymous {

    border: 1px solid #c99a43;
    background: #f4dba6;
    color: #5a3b08;

}

.mado-portal-container .mado-inbox-ticket-status-badge {

    padding: 2px 8px;
    border-radius: 3px;
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;

}

.mado-portal-container .mado-inbox-ticket-status-badge--pending {

    background: #dc2626;

}

/*
 * IN-PROGRESS STATUS TONE / 対応中色の統一（2026-09-02）
 * - 対応中badgeとcard左端ラインはCSV/Googleシートdownload actionと同じミント系SSOTを再利用する。
 * - 別の緑色literalを増やさず、受信箱内のdownload action hue変更にも追従させる。
 */
.mado-portal-container .mado-inbox-ticket-status-badge--in_progress {

    background: var(--mado-inbox-download-action, #18c7a0);

}

.mado-portal-container .mado-inbox-ticket-status-badge--resolved {

    background: #eef2f6;
    color: #64748b;

}

.mado-portal-container .mado-inbox-ticket-id {

    color: #334155;
    font-size: 14px;
    font-weight: 700;

}

.mado-portal-container .mado-inbox-ticket-datetime {

    color: #374151;
    font-size: 12px;
    font-weight: 500;

}

.mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card:not(.is-expanded) {

    overflow: visible;
    padding: 6px 10px 7px 8px;

}

.mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card:not(.is-expanded) .mado-inbox-ticket-card__row {

    min-height: 54px;
    margin: 0;
    align-items: center;

}

/*
 * TICKET CARD CONTENT CONTAINMENT / 一覧カード本文の枠内固定（2026-09-02）
 * - 一覧rowは操作ボタンと本文を同居させるため、狭いcontent幅では本文のintrinsic幅がcard外へ出ないようmainを明示的にclipする。
 * - card自体のoverflow:visibleは操作ボタンtooltip互換のため維持し、本文だけを正規境界内へ収める。
 */
.mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-card__main {

    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 20px;
    row-gap: 3px;
    align-items: center;
    box-sizing: border-box;
    width: auto;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;

}

.mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-card__meta-row {

    grid-column: 1;
    grid-row: 1;
    flex-wrap: nowrap;
    margin: 0;

}

.mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-datetime {

    grid-column: 2;
    grid-row: 1;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

}

.mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-preview {

    grid-column: 1 / -1;
    grid-row: 2;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    overflow: hidden;
    line-height: 1.45;
    text-overflow: ellipsis;
    white-space: nowrap;

}

.mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card:not(.is-expanded) .mado-inbox-ticket-card__actions {

    align-self: center;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-left: auto;

}

.mado-portal-container .mado-inbox-ticket-open-indicator {

    display: none;
    width: 0;
    min-width: 0;
    height: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;

}

.mado-portal-container .mado-inbox-ticket-panel__header {

    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;

}

.mado-portal-container .mado-inbox-ticket-panel__title {

    font-size: 16px;
    font-weight: 700;
    color: #10253f;

}

.mado-portal-container .mado-inbox-ticket-panel__subtitle {

    margin-top: 4px;
    font-size: 12px;
    color: #64748b;

}

.mado-portal-container .mado-inbox-ticket-panel__state {

    font-size: 14px;
    color: #475569;

}

.mado-portal-container .mado-inbox-ticket-panel__state--error {

    color: #b91c1c;

}

.mado-portal-container .mado-inbox-typing-indicator,
.mado-portal-container .mado-inbox-ticket-typing-badge {

    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    background: #eef6ff;
    color: #1d4f80;

}

.mado-portal-container .mado-inbox-typing-indicator {

    margin-bottom: 14px;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 700;

}

.mado-portal-container .mado-inbox-ticket-typing-badge {

    padding: 3px 8px;
    border: 1px solid #b6d9ff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;

}

.mado-portal-container .mado-inbox-ticket-typing-badge[hidden],
.mado-portal-container .mado-inbox-typing-indicator[hidden] {

    display: none;

}

.mado-portal-container .mado-inbox-typing-indicator__dot {

    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #2eb2c1;

}

.mado-portal-container .mado-inbox-ticket-typing-badge__dot {

    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #2eb2c1;

}

.mado-portal-container .mado-inbox-quick-meta-grid,
.mado-portal-container .mado-inbox-quick-messages,
.mado-portal-container .mado-inbox-quick-reply-options {

    display: grid;
    gap: 8px;

}

.mado-portal-container .mado-inbox-quick-meta-card,
.mado-portal-container .mado-inbox-quick-message,
.mado-portal-container .mado-inbox-quick-empty {

    padding: 12px;
    border: 1px solid #dbe7f3;
    border-radius: 10px;
    background: #ffffff;

}

.mado-portal-container .mado-inbox-quick-meta-label,
.mado-portal-container .mado-inbox-quick-section__title {

    font-size: 14px;
    font-weight: 700;
    color: #10253f;

}

.mado-portal-container .mado-inbox-quick-meta-value,
.mado-portal-container .mado-inbox-quick-message__body {

    font-size: 14px;
    line-height: 1.6;
    color: #111827;

}

.mado-portal-container .mado-inbox-quick-history__time,
.mado-portal-container .mado-inbox-quick-message__meta,
.mado-portal-container .mado-inbox-quick-reply-status {

    font-size: 12px;
    color: #64748b;

}

.mado-portal-container .mado-inbox-quick-message--assistant {

    background: #eff6ff;
    border-color: #bfdbfe;

}

.mado-portal-container .mado-inbox-quick-message--operator {

    background: #f0fdf4;
    border-color: #b7efca;

}

.mado-portal-container .mado-inbox-quick-reply-text {

    width: 100%;
    min-height: 104px;
    padding: 10px 12px;
    border: 1px solid #cfd9e5;
    border-radius: 10px;
    background: #ffffff;
    color: #111827;
    font: inherit;
    font-size: 14px;
    line-height: 1.6;
    resize: vertical;

}

.mado-portal-container .mado-inbox-quick-status-standalone-btns {

    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px;

}

.mado-portal-container .mado-inbox-quick-status-standalone-msg--success,
.mado-portal-container .mado-inbox-quick-reply-status--success {

    color: #15803d;

}

.mado-portal-container .mado-inbox-quick-status-standalone-msg--error,
.mado-portal-container .mado-inbox-quick-reply-status--error {

    color: #b91c1c;

}

.mado-portal-container .mado-inbox-quick-status-standalone-msg--info,
.mado-portal-container .mado-inbox-quick-reply-status--info {

    color: #475569;

}

.mado-portal-container .mado-inbox-inline-status--error {

    color: #dc2626;

}

.mado-portal-container .mado-inbox-inline-status--muted {

    color: #6b7280;

}

.mado-portal-container .mado-inbox-inline-status--success {

    color: #10b981;

}

.mado-portal-container .mado-inbox-inline-status--default {

    color: #666666;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-row {

    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 2px 0;
    cursor: pointer;
    user-select: none;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-input {

    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    border: 0;
    white-space: nowrap;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-visual {

    position: relative;
    display: inline-flex;
    width: 48px;
    height: 28px;
    flex: 0 0 48px;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #e5e7eb;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.12);
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-visual::after {

    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 2px 5px rgba(15, 23, 42, 0.22);
    transition: transform 0.18s ease;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-input:checked + .mado-web-push-switch-visual {

    border-color: #1dbfa0;
    background: #1dbfa0;
    box-shadow: inset 0 1px 2px rgba(15, 118, 110, 0.16), 0 0 0 3px rgba(29, 191, 160, 0.12);

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-input:checked + .mado-web-push-switch-visual::after {

    transform: translateX(20px);

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-input:focus-visible + .mado-web-push-switch-visual {

    outline: 3px solid rgba(29, 191, 160, 0.28);
    outline-offset: 2px;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-input:disabled + .mado-web-push-switch-visual {

    opacity: 0.55;
    cursor: not-allowed;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-switch-text {

    color: #0f172a;
    font-weight: 700;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-toggle-state {

    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 3px 9px;
    border: 1px solid #d1d5db;
    border-radius: 999px;
    background: #f8fafc;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-toggle-state.is-on {

    border-color: #99f6e4;
    background: #ecfdf5;
    color: #047857;

}

.mado-portal-container #mado-web-push-settings .mado-web-push-toggle-state.is-off {

    border-color: #e5e7eb;
    background: #f8fafc;
    color: #64748b;

}

.mado-portal-container .mado-inbox-filter-chip:hover,
.mado-portal-container .mado-inbox-filter-chip:focus,
.mado-portal-container .mado-inbox-filter-chip--muted:hover,
.mado-portal-container .mado-inbox-filter-chip--muted:focus {

    background: #f8fbff;
    border-color: #9bb8d6;
    color: #16283a;
    outline: none;

}

.mado-portal-container .mado-inbox-filter-chip--muted {

    background: #ffffff;
    border-color: #c8d6e5;
    color: #243447;

}


.mado-portal-container .mado-inbox-ticket-list-head {

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;

}

.mado-portal-container .mado-inbox-ticket-list-head .mado-inbox-ticket-list-heading {

    margin: 0;

}

.mado-portal-container .mado-support-bulk-toggle.button,
.mado-portal-container .mado-support-bulk-action.button {

    min-height: 36px;
    padding: 7px 13px;
    border: 1px solid #c7d3dd;
    border-radius: 10px;
    background: #ffffff;
    color: #10202f;
    font-size: var(--mado-support-ui-font-13);
    font-weight: 700;
    line-height: 1.2;
    box-shadow: none;
    text-shadow: none;

}

.mado-portal-container .mado-support-bulk-toggle.button:hover,
.mado-portal-container .mado-support-bulk-toggle.button:focus-visible,
.mado-portal-container .mado-support-bulk-toggle.button.is-active {

    border-color: #0f172a;
    background: #0f172a;
    color: #ffffff;
    outline: none;

}

.mado-portal-container .mado-support-bulk-toolbar[hidden] {

    display: none;

}

.mado-portal-container .mado-support-bulk-toolbar {

    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 14px;
    padding: 10px 12px;
    border: 1px solid #cfe0ec;
    border-radius: 12px;
    background: #f7fbfe;

}

.mado-portal-container .mado-support-bulk-select-all {

    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #243447;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;

}

.mado-portal-container .mado-support-bulk-select-all input,
.mado-portal-container .mado-support-ticket-select input {

    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: #0f172a;

}

.mado-portal-container .mado-support-bulk-count {

    color: #526171;
    font-size: 12px;
    font-weight: 700;

}

.mado-portal-container .mado-support-bulk-actions {

    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-left: auto;

}

.mado-portal-container .mado-support-bulk-action--danger.button {

    border-color: #dc2626;
    background: #dc2626;
    color: #ffffff;

}

.mado-portal-container .mado-support-bulk-action.button:disabled {

    opacity: 0.45;
    cursor: not-allowed;

}

.mado-portal-container .mado-support-ticket-select {

    display: none;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    align-self: center;
    min-width: 20px;
    margin: 0;
    padding: 0;
    cursor: pointer;

}

.mado-portal-container .mado-inbox-board.is-bulk-selecting .mado-support-ticket-select {

    display: inline-flex;

}

.mado-portal-container .mado-inbox-ticket-card.is-bulk-selected {

    border-color: #78b8d8;
    box-shadow: 0 0 0 2px rgba(85, 193, 223, 0.18), 0 10px 24px rgba(15, 36, 64, 0.08);

}

.mado-portal-container .mado-inbox-ticket-card:has(.mado-support-card-action:hover),
.mado-portal-container .mado-inbox-ticket-card:has(.mado-support-card-action:focus-visible) {

    z-index: 24;

}

.mado-portal-container .mado-inbox-ticket-card {

    font-size: var(--mado-support-inbox-base-font-size);

}

.mado-portal-container .mado-inbox-ticket-preview,
.mado-portal-container .mado-inbox-quick-message__body,
.mado-portal-container .mado-inbox-quick-reply-text {

    font-size: calc(var(--mado-support-inbox-base-font-size) - 1px);

}

.mado-portal-container .mado-inbox-ticket-datetime,
.mado-portal-container .mado-inbox-quick-message__meta,
.mado-portal-container .mado-inbox-quick-meta-label {

    font-size: calc(var(--mado-support-inbox-base-font-size) - 3px);

}

.mado-portal-container .mado-ui-icon-button.mado-support-card-action {

    appearance: none;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    min-width: 26px;
    height: 26px;
    min-height: 26px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    background-image: none;
    color: #334155;
    line-height: 1;
    text-decoration: none;
    box-shadow: none;
    text-shadow: none;
    cursor: pointer;

}

.mado-portal-container .mado-ui-icon-button.mado-support-card-action:hover,
.mado-portal-container .mado-ui-icon-button.mado-support-card-action:focus-visible {

    background: #f1f5f9;
    color: #0f172a;
    outline: none;
    box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.08);

}

.mado-portal-container .mado-ui-icon-button.mado-support-card-action--trash,
.mado-portal-container .mado-ui-icon-button.mado-support-delete-chip {

    color: #ce2c24;
    order: 4;

}

.mado-portal-container .mado-support-archive-chip,
.mado-portal-container .mado-support-restore-chip {

    order: 3;

}

.mado-portal-container .mado-inbox-detail-chip {

    order: 1;

}

.mado-portal-container .mado-ui-icon-button.mado-support-card-action--trash:hover,
.mado-portal-container .mado-ui-icon-button.mado-support-card-action--trash:focus-visible,
.mado-portal-container .mado-ui-icon-button.mado-support-delete-chip:hover,
.mado-portal-container .mado-ui-icon-button.mado-support-delete-chip:focus-visible {

    background: #fff1f1;
    color: #ce2c24;
    box-shadow: 0 0 0 2px rgba(206, 44, 36, 0.12);

}

.mado-portal-container .mado-support-card-action__icon,
.mado-portal-container .mado-support-card-action__icon svg,
.mado-portal-container .mado-support-card-action .mado-support-action-icon {

    display: block;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    fill: currentColor;

}

.mado-portal-container .mado-support-card-action:disabled {

    opacity: 0.45;
    cursor: wait;

}

.mado-portal-container .mado-support-card-action[data-mado-tooltip] {

    position: relative;

}

.mado-portal-container .mado-support-card-action[data-mado-tooltip]::after,
.mado-portal-container .mado-support-card-action[data-mado-tooltip]::before {

    z-index: 60;

}

.mado-portal-container .mado-inbox-qa-draft-chip.button {

    order: 2;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    min-width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    /* Shared AI motion/color is owned by mado-base.css .mado-ai-action. */
    background-color: #5fbbe8;
    color: #ffffff;
    font-size: 0;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    box-shadow: none;
    text-shadow: none;
    white-space: nowrap;
    cursor: pointer;

}

.mado-portal-container .mado-inbox-qa-draft-chip.button::before {

    content: "AI";
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1;

}

.mado-portal-container .mado-inbox-qa-draft-chip.button::after {

    content: "AIでQ&A案";
    position: absolute;
    right: 50%;
    bottom: calc(100% + 8px);
    z-index: 60;
    transform: translateX(50%);
    display: block;
    width: max-content;
    max-width: 180px;
    padding: 6px 8px;
    border-radius: 6px;
    background: #0f172a;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    white-space: nowrap;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);

}

.mado-portal-container .mado-inbox-qa-draft-chip.button:hover::after,
.mado-portal-container .mado-inbox-qa-draft-chip.button:focus-visible::after {

    opacity: 1;
    visibility: visible;

}

.mado-portal-container .mado-inbox-qa-draft-chip.button:hover,
.mado-portal-container .mado-inbox-qa-draft-chip.button:focus-visible {

    color: #ffffff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(101, 198, 232, 0.24), 0 7px 18px rgba(91, 111, 190, 0.18);

}

.mado-portal-container .mado-support-box-status-chip {

    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #eef3f6;
    color: #526171;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;

}

.mado-portal-container .mado-support-box-status-chip--trashed {

    background: #fff1f2;
    color: #be123c;

}

.mado-portal-container .mado-inbox-ticket-list-heading {

    margin: 20px 0 12px;

}



.mado-portal-container .mado-inbox-csv-status--warn {

    color: #b45309;

}

.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="pending"],
.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="in_progress"],
.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="resolved"] {

    border-left-width: 10px;
    border-left-style: solid;

}

.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="pending"] {

    border-left-color: #ce0e3a;
    background: #fff8fb;

}

.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="in_progress"] {

    border-left-color: var(--mado-inbox-download-action, #18c7a0);
    background: #f7fdf9;

}

.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="resolved"] {

    border-left-color: #94a3b8;
    background: #f8fafc;

}

.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="resolved"]:not(.is-expanded) .mado-inbox-ticket-id,
.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="resolved"]:not(.is-expanded) .mado-inbox-ticket-preview {

    color: #475569;

}

.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="resolved"]:not(.is-expanded) .mado-inbox-ticket-datetime,
.mado-portal-container #mado-tickets-list-container .mado-ticket-item[data-status="resolved"]:not(.is-expanded) .mado-ticket-elapsed {

    color: #64748b;

}

.mado-portal-container .mado-inbox-typing-indicator__dot,
.mado-portal-container .mado-inbox-ticket-typing-badge__dot {

    animation: madoInboxTypingPulse 1.2s ease-in-out infinite;

}

@keyframes madoInboxTypingPulse {

    0%,
100% {

        opacity: 0.55;
        transform: scale(0.82);

    }

    50% {

        opacity: 1;
        transform: scale(1);

    }

}

.mado-portal-container .mado-inbox-quick-meta-grid {

    grid-template-columns: 1fr;
    margin-bottom: 16px;

}

.mado-portal-container .mado-inbox-quick-meta-card {

    min-width: 0;

}

.mado-portal-container .mado-inbox-quick-meta-label {

    margin-bottom: 6px;
    color: #64748b;
    font-size: 11px;
    letter-spacing: 0.03em;
    text-transform: uppercase;

}

.mado-portal-container .mado-inbox-quick-meta-value {

    color: #10253f;
    line-height: 1.55;
    word-break: break-word;

}

.mado-portal-container .mado-inbox-quick-meta-value--path {

    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    white-space: nowrap;
    word-break: normal;
    scrollbar-width: thin;

}

.mado-portal-container .mado-inbox-quick-meta-path-step {

    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    white-space: nowrap;
    word-break: normal;

}

.mado-portal-container .mado-inbox-quick-meta-path-step + .mado-inbox-quick-meta-path-step::before {

    content: "\2192";
    flex: 0 0 auto;
    margin-right: 8px;
    color: #94a3b8;
    font-weight: 800;

}

.mado-portal-container .mado-inbox-quick-meta-hint {

    display: inline-block;
    padding: 4px 8px;
    border: 1px solid #dbe7f3;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 12px;
    line-height: 1.2;

}

.mado-portal-container .mado-inbox-quick-section {

    margin-top: 16px;

}

.mado-portal-container .mado-inbox-quick-section__title {

    margin-bottom: 8px;

}

.mado-portal-container .mado-inbox-quick-messages {

    min-height: 0;
    height: auto;
    max-height: min(60vh, 560px);
    align-content: start;
    grid-auto-rows: max-content;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 4px;
    resize: vertical;

}

.mado-portal-container .mado-inbox-quick-message {

    border-color: #d9e3ee;

}

.mado-portal-container .mado-inbox-quick-history {

    display: flex;
    align-items: baseline;
    gap: 10px;
    font-size: 12px;
    line-height: 1.45;
    color: #64748b;
    flex-direction: row;
    justify-content: flex-start;
    padding: 2px 0 6px;
    margin: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    font-weight: 400;

}

.mado-portal-container .mado-inbox-quick-history__text {

    flex: 1 1 auto;
    min-width: 0;
    word-break: break-word;

}

.mado-portal-container .mado-inbox-quick-history__time {

    flex: 0 0 auto;
    color: #94a3b8;
    font-size: 11px;
    font-weight: 400;
    white-space: nowrap;

}

.mado-portal-container .mado-inbox-quick-message__meta {

    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;

}

.mado-portal-container .mado-inbox-quick-message__author {

    color: #0f2440;
    font-weight: 700;

}

.mado-portal-container .mado-inbox-quick-message__time {

    color: #64748b;

}

.mado-portal-container .mado-inbox-quick-message__body {

    word-break: break-word;
    white-space: normal;

}

.mado-portal-container .mado-inbox-quick-empty {

    padding: 14px 12px;
    border-style: dashed;
    border-color: #ccd7e3;
    color: #64748b;
    font-size: 13px;

}

.mado-portal-container .mado-inbox-quick-reply-options {

    gap: 4px;
    margin-top: 8px;

}

.mado-portal-container .mado-inbox-quick-reply-option {

    display: flex;
    align-items: flex-start;
    gap: 7px;
    color: #334155;
    font-size: 12px;
    line-height: 1.45;

}

.mado-portal-container .mado-inbox-quick-reply-option input[type="checkbox"] {

    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    margin: 2px 0 0;

}

.mado-portal-container .mado-inbox-quick-reply-row {

    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: end;
    gap: 12px;
    margin-top: 10px;
    column-gap: 18px;
    row-gap: 10px;

}

.mado-portal-container .mado-inbox-quick-reply-row-primary {

    display: flex;
    grid-column: 2;
    grid-row: 1;
    flex-direction: column;
    align-items: flex-end;
    justify-self: end;
    gap: 6px;
    min-width: 0;

}

.mado-portal-container .mado-inbox-quick-status-standalone {

    display: flex;
    grid-column: 1;
    grid-row: 1;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    justify-self: start;
    min-width: 0;

}

.mado-portal-container .mado-inbox-quick-status-standalone-msg {

    max-width: 280px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
    text-align: left;

}

/* SUPPORT STATUS BUTTON SSOT / 状態変更ボタン正本（2026-08-12）
 * 受信箱状態ボタンはgeneric scenario buttonへ接続しない。
 * 「対応中にする」はテンプレート集、「解決済みにする」は定型返信と同じ色変数を使用する。
 * 形・寸法・状態更新ロジックはこの専用componentだけで完結させる。
 */
.mado-portal-container .mado-inbox-quick-status-standalone-btn {

    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    min-height: 42px;
    padding: 10px 26px;
    border: 1px solid transparent;
    border-radius: 999px;
    background-image: none;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    text-decoration: none;
    text-shadow: none;
    box-shadow: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease;

}

.mado-portal-container .mado-inbox-quick-status-standalone-btn[data-mado-quick-standalone-status="in_progress"] {

    border-color: var(--mado-support-tool-outline-border);
    background: var(--mado-support-tool-outline-bg);
    color: var(--mado-support-tool-outline-text);

}

.mado-portal-container .mado-inbox-quick-status-standalone-btn[data-mado-quick-standalone-status="in_progress"]:hover,
.mado-portal-container .mado-inbox-quick-status-standalone-btn[data-mado-quick-standalone-status="in_progress"]:focus-visible {

    border-color: var(--mado-support-tool-outline-border);
    background: var(--mado-support-tool-outline-hover-bg);
    color: var(--mado-support-tool-outline-text);
    outline: none;

}

.mado-portal-container .mado-inbox-quick-status-standalone-btn[data-mado-quick-standalone-status="resolved"] {

    border-color: var(--mado-support-tool-primary-border);
    background: var(--mado-support-tool-primary-bg);
    color: var(--mado-support-tool-primary-text);

}

.mado-portal-container .mado-inbox-quick-status-standalone-btn[data-mado-quick-standalone-status="resolved"]:hover,
.mado-portal-container .mado-inbox-quick-status-standalone-btn[data-mado-quick-standalone-status="resolved"]:focus-visible {

    border-color: var(--mado-support-tool-primary-border);
    background: var(--mado-support-tool-primary-bg);
    color: var(--mado-support-tool-primary-text);
    outline: none;

}

.mado-portal-container .mado-inbox-quick-status-standalone-btn:disabled {

    opacity: 0.45;
    cursor: not-allowed;

}


/* 返信送信はこの画面の主操作。MADO共通の保存・適用系グリーンを使い、
 * 状態変更ボタンより明確に大きく見せる。
 */
.mado-portal-container .mado-inbox-quick-reply-submit {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    min-height: 42px;
    padding: 10px 26px;
    border: 1px solid var(--mado-action-primary-border, #06bfb5);
    border-radius: 999px;
    background: var(--mado-action-primary-bg, #06bfb5);
    color: var(--mado-action-primary-text, #ffffff);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    box-shadow: 0 10px 22px rgba(6, 191, 181, 0.18);
    cursor: pointer;
    transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;

}

.mado-portal-container .mado-inbox-quick-reply-submit:hover,
.mado-portal-container .mado-inbox-quick-reply-submit:focus-visible {

    border-color: var(--mado-action-primary-border-hover, #05a9a1);
    background: var(--mado-action-primary-bg-hover, #05a9a1);
    color: var(--mado-action-primary-text, #ffffff);
    outline: none;
    box-shadow: 0 14px 26px rgba(6, 191, 181, 0.24);
    transform: translateY(-1px);

}

.mado-portal-container .mado-inbox-quick-reply-submit[disabled] {

    opacity: 0.65;
    cursor: wait;
    transform: none;

}


.mado-portal-container .mado-support-confirm-modal .mado-ui-confirm-modal__dialog {

    width: min(420px, 100%);
    padding: 22px 24px;

}

.mado-portal-container .mado-support-confirm-modal .mado-ui-confirm-modal__actions {

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;

}

.mado-portal-container .mado-support-confirm-modal .mado-ui-confirm-modal__button {

    width: 100%;
    min-height: 40px;
    margin: 0;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;

}

.mado-portal-container .mado-support-confirm-modal__cancel.button {

    border-color: #434650;
    background: #434650;
    color: #ffffff;

}

.mado-portal-container .mado-support-confirm-modal__confirm.button {

    border-color: #cbd5e1;
    background: #ffffff;
    color: #1f2937;

}

.mado-portal-container .mado-support-confirm-modal.is-trash .mado-support-confirm-modal__confirm.button {

    border-color: #e5262a;
    background: #e5262a;
    color: #ffffff;

}

.mado-portal-container .mado-support-confirm-modal.is-restore .mado-support-confirm-modal__confirm.button {

    border-color: #0f172a;
    background: #0f172a;
    color: #ffffff;

}

/* Q&A DRAFT UI CSS SSOT / Q&A案UI CSS一本化（2026-09-02）
 * current UIはticket内inline panelだけ。旧hidden modal用selectorはcaller/DOM使用0確認後に削除した。
 * Q&A案の第二modal CSSを追加せず、inline panelと共有MADO modal primitiveの責任を分ける。
 */
.mado-portal-container .mado-support-qa-inline-panel {

    margin: 0 0 14px;
    padding: 14px 16px 16px;
    border: 1px solid #cfe1f0;
    border-radius: 12px;
    background: #f8fbff;
    box-sizing: border-box;

}

.mado-portal-container .mado-inbox-ticket-card.is-placing-qa-draft .mado-inbox-ticket-panel > :not([data-mado-qa-draft-inline]) {

    visibility: hidden;

}

.mado-portal-container .mado-support-qa-inline-panel__header {

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;

}

.mado-portal-container .mado-support-qa-inline-panel__title {

    margin: 0;
    color: #10253f;
    font-size: var(--mado-support-inbox-base-font-size);
    font-weight: 800;
    line-height: 1.35;

}

.mado-portal-container .mado-support-qa-inline-panel__status {

    margin: 12px 0;
    padding: 10px 12px;
    border: 1px solid #cdeaf0;
    border-radius: 8px;
    background: #f0fbfd;
    color: #17445a;
    font-size: calc(var(--mado-support-inbox-base-font-size) - 2px);
    font-weight: 700;
    line-height: 1.5;

}

.mado-portal-container .mado-support-qa-inline-panel__status:empty {

    display: none;

}

.mado-portal-container .mado-support-qa-inline-panel__status.is-error {

    border-color: #fecaca;
    background: #fff1f2;
    color: #b42318;

}

.mado-portal-container .mado-support-qa-inline-panel__fields {

    display: grid;
    gap: 12px;
    margin: 12px 0 16px;

}

.mado-portal-container .mado-support-qa-inline-panel__field {

    display: grid;
    gap: 6px;
    color: #10202f;
    font-size: calc(var(--mado-support-inbox-base-font-size) - 2px);
    font-weight: 800;

}

.mado-portal-container .mado-support-qa-inline-panel__field textarea {

    width: 100%;
    min-height: 92px;
    padding: 10px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #ffffff;
    color: #0f172a;
    font-size: calc(var(--mado-support-inbox-base-font-size) - 1px);
    font-weight: 500;
    line-height: 1.65;
    resize: vertical;
    box-sizing: border-box;

}

.mado-portal-container .mado-support-qa-inline-panel__field select {

    width: 100%;
    min-height: 42px;
    padding: 8px 34px 8px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #ffffff;
    color: #0f172a;
    font-size: calc(var(--mado-support-inbox-base-font-size) - 1px);
    font-weight: 600;
    box-sizing: border-box;

}

.mado-portal-container .mado-support-qa-draft-field-heading {

    display: inline-flex;
    align-items: center;
    gap: 7px;

}

.mado-portal-container .mado-support-qa-help-chip {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid #22c55e;
    border-radius: 999px;
    background: #ecfdf5;
    color: #087443;
    font-size: calc(var(--mado-support-inbox-base-font-size) - 2px);
    font-weight: 900;
    line-height: 1;
    cursor: pointer;

}

.mado-portal-container .mado-support-qa-help-chip:hover,
.mado-portal-container .mado-support-qa-help-chip:focus-visible,
.mado-portal-container .mado-support-qa-help-chip.is-open {

    border-color: #16a34a;
    background: #16a34a;
    color: #ffffff;
    outline: none;
    box-shadow: 0 10px 18px rgba(21, 128, 61, 0.18);

}

.mado-portal-container .mado-support-qa-help-chip:focus,
.mado-portal-container .mado-support-qa-help-chip:focus-visible {

    outline: none;

}

.mado-portal-container .mado-support-qa-help-popover {

    display: block;
    padding: 12px 14px;
    border: 1px solid #bfe4ef;
    border-radius: 10px;
    background: #ffffff;
    color: #244052;
    /* Default 15px scale => 14px, which is 2px larger than the previous help text. */
    font-size: calc(var(--mado-support-inbox-base-font-size) - 1px);
    font-weight: 500;
    line-height: 1.7;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);

}

.mado-portal-container .mado-support-qa-help-popover[hidden] {

    display: none;

}

.mado-portal-container .mado-support-qa-inline-panel__field textarea:disabled {

    background: #f8fafc;
    color: #64748b;

}

.mado-portal-container .mado-support-qa-inline-panel__actions {

    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;

}

.mado-portal-container .mado-support-qa-inline-panel__generate.button,
.mado-portal-container .mado-support-qa-inline-panel__transfer.button {

    flex: 0 0 auto;
    min-width: 112px;
    min-height: 40px;
    padding: 9px 20px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;

}

/* AI generation uses the shared animated AI identity. Registration remains a normal action. */
.mado-portal-container .mado-support-qa-inline-panel__generate.button {

    border-color: transparent;
    background-color: #5fbbe8;
    color: #ffffff;

}

.mado-portal-container .mado-support-qa-inline-panel__transfer.button {

    border-color: #0284c7;
    background: #0284c7;
    color: #ffffff;

}

.mado-portal-container .mado-support-qa-inline-panel__generate.button:hover,
.mado-portal-container .mado-support-qa-inline-panel__generate.button:focus-visible {

    border-color: transparent;
    color: #ffffff;
    box-shadow: 0 0 0 2px rgba(101, 198, 232, 0.22), 0 8px 20px rgba(91, 111, 190, 0.18);

}

.mado-portal-container .mado-support-qa-inline-panel__transfer.button:hover,
.mado-portal-container .mado-support-qa-inline-panel__transfer.button:focus-visible {

    border-color: #0369a1;
    background: #0369a1;
    color: #ffffff;

}

.mado-portal-container .mado-support-qa-inline-panel__generate.button:disabled,
.mado-portal-container .mado-support-qa-inline-panel__transfer.button:disabled {

    border-color: #cbd5e1;
    background: #e2e8f0;
    color: #64748b;
    cursor: not-allowed;

}

html.mado-support-confirm-open,
body.mado-support-confirm-open {

    overflow: hidden;

}

@media (min-width: 901px) and (max-width: 1350px), (max-width: 900px) {

    .mado-portal-container .mado-support-toolbar__csv.button,
    .mado-portal-container .mado-support-toolbar__tsv.button {

        padding-left: 14px;
        padding-right: 14px;

    }

    .mado-portal-container .mado-support-toolbar__csv.button .mado-support-download-action__label,
    .mado-portal-container .mado-support-toolbar__tsv.button .mado-support-download-action__label {

        font-size: 0;

    }

    .mado-portal-container #mado-support-site-csv-download .mado-support-download-action__label::after {

        content: "CSV";
        font-size: var(--mado-support-ui-font-13);

    }

    .mado-portal-container #mado-support-site-sheet-download .mado-support-download-action__label::after {

        content: "Google";
        font-size: var(--mado-support-ui-font-13);

    }

}


@media (max-width: 1180px) {

    .mado-portal-container .mado-inbox-ticket-list-head {

        align-items: flex-start;
        flex-wrap: wrap;

    }

    .mado-portal-container .mado-support-bulk-toolbar {

        align-items: stretch;

    }

    .mado-portal-container .mado-support-bulk-actions {

        width: 100%;
        margin-left: 0;

    }


    .mado-portal-container .mado-support-toolbar__primary {

        align-items: stretch;

    }

    .mado-portal-container .mado-support-toolbar__section--search {

        flex-basis: 100%;
        border-bottom: 1px solid #dfe7ef;

    }

    .mado-portal-container .mado-support-toolbar__section--display {

        border-left: 0;

    }

}

@media (min-width: 901px) and (max-width: 1350px) {

    .mado-portal-container .mado-support-toolbar {

        display: grid;
        align-items: stretch;
        grid-template-columns: minmax(0, 1fr) auto;

    }

    .mado-portal-container .mado-support-toolbar__primary {

        display: contents;

    }

    .mado-portal-container .mado-support-toolbar__section--search {

        grid-column: 1;
        grid-row: 1;
        flex: 1 1 430px;
        border-bottom: 0;

    }

    .mado-portal-container .mado-support-toolbar__section--display {

        grid-column: 2;
        grid-row: 1;
        flex: 0 0 auto;
        border-left: 1px solid #dfe7ef;

    }

    .mado-portal-container .mado-support-toolbar__section--period-export {

        grid-column: 1;
        grid-row: 2;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 10px;
        border-top: 1px solid #dfe7ef;
        border-bottom: 0;
        overflow-x: auto;

    }

    .mado-portal-container .mado-support-period-filter {

        flex: 0 1 auto;

    }

    .mado-portal-container .mado-support-toolbar__export-buttons {

        flex: 0 0 auto;
        margin-left: 6px;

    }

    .mado-portal-container .mado-support-box-tabs {

        grid-column: 2;
        grid-row: 2;
        margin-left: auto;
        border-top: 1px solid #dfe7ef;

    }

    .mado-portal-container .mado-support-condition-panel {

        grid-column: 1 / -1;
        grid-row: 3;

    }

    .mado-portal-container .mado-support-toolbar__feedback {

        grid-column: 1 / -1;
        grid-row: 4;

    }

}

@media (max-width: 1000px) {

    .mado-portal-container .mado-support-toolbar {

        display: grid;
        align-items: stretch;
        grid-template-columns: auto minmax(0, 1fr);

    }

    .mado-portal-container .mado-support-toolbar__primary {

        display: contents;

    }

    .mado-portal-container .mado-support-toolbar__section--search {

        grid-column: 1 / -1;
        grid-row: 1;
        flex: 1 1 420px;
        border-bottom: 1px solid #dfe7ef;

    }

    .mado-portal-container .mado-support-toolbar__section--display {

        grid-column: 1;
        grid-row: 2;
        flex: 0 0 auto;
        border-left: 0;

    }

    .mado-portal-container .mado-support-toolbar__section--display,
    .mado-portal-container .mado-support-box-tabs {

        flex: 0 0 auto;

    }

    .mado-portal-container .mado-support-box-tabs {

        grid-column: 2;
        grid-row: 2;
        justify-content: flex-start;
        margin-left: 0;
        border-top: 0;

    }

    .mado-portal-container .mado-support-toolbar__section--period-export {

        grid-column: 1 / -1;
        grid-row: 3;
        align-items: center;
        justify-content: flex-start;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
        border-top: 1px solid #dfe7ef;
        overflow-x: visible;

    }

    .mado-portal-container .mado-support-period-filter {

        flex: 0 1 auto;
        flex-wrap: wrap;
        overflow-x: visible;

    }

    .mado-portal-container .mado-support-toolbar__export-buttons {

        flex: 0 0 auto;
        margin-left: 6px;
        overflow-x: visible;

    }

    .mado-portal-container .mado-support-condition-panel {

        grid-column: 1 / -1;
        grid-row: 4;

    }

    .mado-portal-container .mado-support-toolbar__feedback {

        grid-column: 1 / -1;
        grid-row: 5;

    }

}

@media (max-width: 782px) {

    .mado-portal-container .mado-inbox-board {

        padding: 18px;

    }

    .mado-portal-container .mado-support-toolbar {

        grid-template-columns: auto minmax(0, 1fr);

    }

    .mado-portal-container .mado-support-toolbar__section--search,
    .mado-portal-container .mado-support-toolbar__section--period-export,
    .mado-portal-container .mado-support-condition-panel,
    .mado-portal-container .mado-support-toolbar__feedback {

        grid-column: 1 / -1;
        grid-row: auto;

    }

    .mado-portal-container .mado-support-toolbar__section,
    .mado-portal-container .mado-support-box-tabs {

        width: 100%;
        border-left: 0;
        border-top: 1px solid #dfe7ef;

    }

    .mado-portal-container .mado-support-toolbar__section {

        justify-content: flex-start;
        padding: 12px 14px;

    }

    .mado-portal-container .mado-support-toolbar__section--display {

        flex-wrap: wrap;

    }

    .mado-portal-container .mado-support-box-tabs {

        justify-content: flex-start;
        margin-left: 0;
        padding: 12px 14px;
        border-left: 1px solid #dfe7ef;

    }

    .mado-portal-container .mado-support-toolbar__section--period-export {

        align-items: center;

    }

    .mado-portal-container .mado-support-period-filter,
    .mado-portal-container .mado-support-toolbar__export-buttons {

        justify-content: flex-start;
        width: auto;
        flex: 0 0 auto;

    }

    .mado-portal-container .mado-support-period-filter {

        flex-wrap: wrap;

    }

    .mado-portal-container .mado-support-toolbar__export-buttons {

        flex-wrap: nowrap;

    }

    .mado-portal-container .mado-support-box-tab.button,
    .mado-portal-container .mado-support-period-filter__link.button,
    .mado-portal-container .mado-support-toolbar__csv.button,
    .mado-portal-container .mado-support-toolbar__tsv.button {

        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 40px;
        padding: 0 14px;

    }

    .mado-portal-container .mado-support-toolbar__csv.button,
    .mado-portal-container .mado-support-toolbar__tsv.button {

        flex: 0 0 auto;
        min-width: max-content;

    }

    .mado-portal-container .mado-support-search-form {

        align-items: stretch;
        flex-direction: column;

    }

    .mado-portal-container .mado-support-search-form__field {

        flex: 0 1 auto;
        min-width: 0;
        width: 100%;

    }

    .mado-portal-container .mado-support-search-form__submit.button,
    .mado-portal-container .mado-support-search-form__conditions.button {

        width: 100%;

    }

    .mado-portal-container .mado-support-condition-panel__inner {

        align-items: stretch;
        flex-direction: column;

    }

    .mado-portal-container .mado-support-condition-panel__group {

        align-items: stretch;
        flex-direction: column;

    }

    .mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-card__main {

        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto auto;
        column-gap: 0;
        justify-items: start;
        justify-self: stretch;
        width: 100%;
        text-align: left;

    }

    .mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-card__meta-row {

        grid-column: 1;
        grid-row: 1;
        justify-content: flex-start;
        justify-self: stretch;
        width: 100%;
        text-align: left;

    }

    .mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-id,
    .mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-ticket-elapsed {

        text-align: left;

    }

    .mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card:not(.is-expanded) .mado-inbox-ticket-card__actions {

        flex-wrap: wrap;
        justify-content: flex-start;

    }

    .mado-portal-container .mado-inbox-qa-draft-chip.button {

        width: 32px;
        min-width: 32px;
        height: 32px;
        min-height: 32px;
        padding: 0;

    }

    .mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-datetime {

        grid-column: 1;
        grid-row: 2;

    }

    .mado-portal-container #mado-tickets-list-container .mado-inbox-ticket-card .mado-inbox-ticket-preview {

        grid-column: 1;
        grid-row: 3;

    }

    .mado-portal-container .mado-inbox-ticket-panel__header,
.mado-portal-container .mado-inbox-quick-reply-row {

        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: stretch;

    }

    .mado-portal-container .mado-inbox-quick-status-standalone {

        grid-column: 1;
        grid-row: 1;
        align-items: flex-start;
        justify-self: stretch;

    }

    .mado-portal-container .mado-inbox-quick-reply-row-primary {

        grid-column: 1;
        grid-row: 2;
        align-items: stretch;
        justify-self: stretch;

    }

    .mado-portal-container .mado-inbox-quick-status-standalone-btns {

        justify-content: flex-start;

    }

    .mado-portal-container .mado-inbox-quick-status-standalone-msg {

        max-width: none;
        text-align: left;

    }

    .mado-portal-container .mado-inbox-quick-reply-submit {

        width: 100%;

    }

}

/* MADO support inbox reply templates */
body.mado-portal-account-page .mado-support-reply-template-panel {

    --mado-support-reply-template-action: #18c7a0;
    --mado-support-reply-template-action-hover: #10a987;
    --mado-support-reply-template-bg: #eefbf7;
    --mado-support-reply-template-bg-hover: #ddf7ef;
    --mado-support-reply-search-action: #0798a7;
    --mado-support-reply-search-action-hover: #087682;
    --mado-support-reply-search-bg: #eefaff;
    --mado-support-reply-search-bg-hover: #d7f2f9;
    --mado-support-reply-toolbar-divider: #d8e3ed;
    /*
     * REPLY TOOLBAR CONTAINER SSOT / 返信ツールバー幅判定正本（2026-09-02）:
     * - viewport幅や左ナビ開閉状態を参照せず、このパネル自身の利用可能幅だけで1段/2段を決める。
     * - 左ナビを受信箱都合で自動開閉しない。ユーザーが選んだPortalナビ状態を維持する。
     */
    container-type: inline-size;
    container-name: mado-support-reply-toolbar;
    position: relative;
    margin: 12px 0;
    padding: 12px;
    border: 1px solid #dbeafe;
    border-radius: 8px;
    background: #f8fbff;

}

/*
 * RESPONSIVE REPLY TOOLBAR / 返信ツールバー配置正本（2026-09-02）
 * - viewport breakpointではなく、上の named container の実幅だけで1段/2段を切り替える。
 * - 利用可能幅が920pxを超える時は2つのrow groupを1列として連結する。
 * - 920px以下は「基本操作」「検索+AI」の固定2段。左ナビ開閉やviewport幅に依存しない。
 * - 850/760等の返信ツールバー専用breakpointやJS幅判定を追加しない。狭幅はrow単位の横スクロールで定位置を維持する。
 * - DOM/Tab順はsupport-inbox.jsのensureReplyToolbarRows()が正本。CSS orderで反転させない。
 */
body.mado-portal-account-page .mado-support-reply-template-panel__head {

    display: flex;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 0;
    min-width: 0;

}

body.mado-portal-account-page .mado-support-reply-toolbar-row {

    display: inline-flex;
    align-items: stretch;
    flex: 0 0 auto;
    min-width: 0;

}

body.mado-portal-account-page .mado-support-reply-toolbar-row--secondary {

    flex: 1 1 auto;

}

body.mado-portal-account-page .mado-support-reply-template-panel__toggle {

    appearance: none;
    min-height: 40px;
    margin: 0;
    padding: 0 15px;
    border: 0;
    border-radius: 0;
    background: var(--mado-support-reply-template-bg);
    color: var(--mado-support-reply-template-action);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
    text-shadow: none;

}

body.mado-portal-account-page .mado-support-reply-template-panel__toggle--templates {

    border-left: 1px solid var(--mado-support-reply-template-action);
    background: var(--mado-support-reply-template-bg);
    color: var(--mado-support-reply-template-action);

}

/* REPLY TEMPLATE REGISTER LAUNCHER / 新規定型文登録＋（2026-08-12） */
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-register-launcher.button {

    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    height: auto;
    min-height: 40px;
    margin: 0;
    padding: 0 15px;
    border: 0;
    border-left: 1px solid var(--mado-support-reply-template-action);
    border-radius: 0;
    background: var(--mado-support-reply-template-bg);
    color: var(--mado-support-reply-template-action);
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
    text-shadow: none;
    white-space: nowrap;
    cursor: pointer;

}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-register-launcher.button svg {

    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    fill: currentColor;
    pointer-events: none;

}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-register-launcher.button:hover,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-register-launcher.button:focus-visible,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-register-launcher.button[aria-expanded="true"] {

    border-color: var(--mado-support-reply-template-action);
    background: var(--mado-support-reply-template-bg-hover);
    color: var(--mado-support-reply-template-action-hover);
    outline: none;
    box-shadow: none;

}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-format-toolbar {

    display: inline-flex;
    align-items: stretch;
    gap: 0;
    padding: 0;
    border: 0;
    background: #ffffff;

}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-format-button.button {

    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 0;
    min-height: 40px;
    margin: 0;
    padding: 0 15px;
    border: 0;
    border-left: 1px solid var(--mado-support-reply-toolbar-divider);
    border-radius: 0;
    background: #ffffff;
    color: #10202f;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    box-shadow: none;
    text-shadow: none;
    cursor: pointer;

}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-format-button.button:hover,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-format-button.button:focus-visible {

    background: #f8fafc;
    color: #0f5268;
    outline: none;
    box-shadow: none;

}

/* REPLY LINK MODAL BUTTON TYPE / リンク挿入ボタン文字（2026-08-12） */
body.mado-portal-account-page .mado-portal-shell--action-support-inbox [data-mado-reply-link-modal] .mado-ui-modal__button {

    font-size: 13px;

}

body.mado-portal-account-page .mado-support-reply-template-panel__toggle:hover,
body.mado-portal-account-page .mado-support-reply-template-panel__toggle:focus-visible,
body.mado-portal-account-page .mado-support-reply-template-panel__toggle[aria-expanded="true"] {

    background: var(--mado-support-reply-template-bg-hover);
    color: var(--mado-support-reply-template-action-hover);
    outline: none;
    box-shadow: none;

}

body.mado-portal-account-page .mado-support-reply-template-panel__content {

    margin-top: 24px;

}

body.mado-portal-account-page .mado-support-reply-template-panel__tabs {

    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;

}

body.mado-portal-account-page .mado-support-reply-template-panel__tab {

    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    padding: 6px 11px;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #ffffff;
    color: #334155;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;

}

body.mado-portal-account-page .mado-support-reply-template-panel__tab.is-active {

    border-color: #7dd3fc;
    background: #e0f2fe;
    color: #16325c;

}

body.mado-portal-account-page .mado-support-reply-template-panel__tab span {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    min-height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.08);
    font-size: 11px;
    font-weight: 500;

}

body.mado-portal-account-page .mado-support-reply-template-panel__tab.is-active span {

    background: #ffffff;
    color: #16325c;

}

body.mado-portal-account-page .mado-support-reply-template-panel__items {

    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;

}

body.mado-portal-account-page .mado-support-reply-template-card {

    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
    align-items: stretch;

}

body.mado-portal-account-page .mado-support-reply-template-card__insert {

    display: grid;
    gap: 5px;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #dbeafe;
    border-radius: 8px;
    background: #ffffff;
    color: #0f172a;
    text-align: left;
    cursor: pointer;

}

body.mado-portal-account-page .mado-support-reply-template-card__insert--preview {

    cursor: pointer;

}

body.mado-portal-account-page .mado-support-reply-template-card__insert:hover,
body.mado-portal-account-page .mado-support-reply-template-card__insert:focus-visible {

    border-color: #38bdf8;
    box-shadow: 0 8px 18px rgba(14, 165, 233, 0.12);
    outline: none;

}

body.mado-portal-account-page .mado-support-reply-template-card__title {

    font-size: 12px;
    line-height: 1.45;
    font-weight: 500;

}

body.mado-portal-account-page .mado-support-reply-template-card__meta {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: start;
    width: auto;
    min-height: 18px;
    padding: 1px 6px;
    border-radius: 999px;
    background: #e0f2fe;
    color: #0369a1;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;

}

body.mado-portal-account-page .mado-support-reply-template-card__preview {

    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: #475569;
    font-size: 14px;
    line-height: 1.55;
    white-space: pre-line;

}

body.mado-portal-account-page .mado-support-reply-template-card__delete {

    align-self: start;
    min-height: 32px;
    padding: 5px 8px;
    border: 1px solid #fecaca;
    border-radius: 8px;
    background: #fff1f2;
    color: #be123c;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;

}

body.mado-portal-account-page .mado-support-reply-template-card__apply {

    align-self: center;
    justify-self: end;
    width: auto;
    height: auto;
    min-height: 28px;
    max-height: 32px;
    padding: 4px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #ffffff;
    color: #111827;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;

}

body.mado-portal-account-page .mado-support-reply-template-card__apply:hover,
body.mado-portal-account-page .mado-support-reply-template-card__apply:focus-visible {

    border-color: #38bdf8;
    background: #e0f2fe;
    color: #075985;
    outline: none;

}

body.mado-portal-account-page .mado-support-reply-template-panel__empty {

    margin: 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.6;

}

body.mado-portal-account-page .mado-support-reply-template-panel__empty.is-error {

    color: #be123c;

}

body.mado-portal-account-page .mado-support-reply-template-panel__editor {

    margin-top: 14px;
    border-top: 1px solid #dbeafe;
    padding-top: 14px;

}

body.mado-portal-account-page .mado-support-reply-template-panel.is-reply-template-registration-only .mado-support-reply-template-panel__body {

    display: none;

}

body.mado-portal-account-page .mado-support-reply-template-panel.is-reply-template-registration-only .mado-support-reply-template-panel__content {

    margin-top: 12px;

}

body.mado-portal-account-page .mado-support-reply-template-panel.is-reply-template-registration-only .mado-support-reply-template-panel__editor {

    margin-top: 0;
    border-top: 0;
    padding-top: 0;

}

body.mado-portal-account-page .mado-support-reply-template-panel__editor summary {

    display: none;

}

/* SUPPORT INBOX FIELD FOCUS / 受信箱の入力欄focus（2026-08-12）
 * 共通mado-base.cssの水色focus表現は他画面の正本として維持する。
 * チャット受信箱の返信パネル内だけ、クリック時に水色へ切り替えず
 * 通常のグレー枠＋控えめなニュートラルfocusへ戻す。
 */
body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-inbox-ticket-panel input:focus,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-inbox-ticket-panel select:focus,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-inbox-ticket-panel textarea:focus {

    border-color: var(--mado-portal-field-border, #cbd5e1);
    outline: 1px solid #94a3b8;
    outline-offset: 0;
    box-shadow: none;

}

body.mado-portal-account-page .mado-support-reply-template-editor {

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 10px;

}

body.mado-portal-account-page .mado-support-reply-template-editor label {

    display: grid;
    gap: 5px;
    color: #334155;
    font-size: 13px;
    font-weight: 700;

}

body.mado-portal-account-page .mado-support-reply-template-editor > label:not(.mado-support-reply-template-editor__body) {

    font-size: 14px;

}

body.mado-portal-account-page .mado-support-reply-template-editor input,
body.mado-portal-account-page .mado-support-reply-template-editor select,
body.mado-portal-account-page .mado-support-reply-template-editor textarea {

    width: 100%;
    font-size: 14px;
    font-weight: 400;

}

body.mado-portal-account-page .mado-support-reply-template-editor__body textarea {

    font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;

}

/* REPLY TEMPLATE TITLE INPUT TYPOGRAPHY / タイトル入力文字（2026-08-12）
 * 隣のcategory/selectと同程度の通常ウェイトを正本とする。
 * labelの太字やtheme側input ruleを継承させない。
 */
body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-editor input[data-mado-reply-template-title] {

    font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;

}

/* REPLY TEMPLATE CATEGORY SELECT / 定型返信カテゴリー選択（2026-08-12）
 * - category保存は既存template categoryを正本とし、このCSSは選択/新規名入力の配置だけを担当する。
 * - 新規カテゴリー用の第二保存UIや別管理画面は作らない。
 */
body.mado-portal-account-page .mado-support-reply-template-editor select {

    padding-right: 42px;
    background-color: #ffffff;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%226%22%20viewBox%3D%220%200%2010%206%22%3E%3Cpath%20d%3D%22M1%201l4%204%204-4%22%20fill%3D%22none%22%20stroke%3D%22%2364748b%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right 18px center;
    background-size: 10px 6px;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;

}

body.mado-portal-account-page .mado-support-reply-template-category-controls {

    display: grid;
    gap: 6px;
    min-width: 0;

}

body.mado-portal-account-page .mado-support-reply-template-category-new-row {

    min-width: 0;

}

body.mado-portal-account-page .mado-support-reply-template-category-new-row[hidden] {

    display: none;

}

body.mado-portal-account-page .mado-support-reply-template-category-new-row input {

    width: 100%;

}

body.mado-portal-account-page .mado-support-reply-template-editor__body,
body.mado-portal-account-page .mado-support-reply-template-editor__actions {

    grid-column: 1 / -1;

}

body.mado-portal-account-page .mado-support-reply-template-editor__actions {

    display: flex;
    align-items: center;
    gap: 10px;
    color: #64748b;
    font-size: 13px;

}

body.mado-portal-account-page .mado-support-reply-template-editor__actions button[data-mado-reply-template-save] {

    min-width: 132px;
    min-height: 42px;
    padding: 10px 26px;
    border: 1px solid #0284c7;
    border-radius: 999px;
    background: #0284c7;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    box-shadow: none;
    text-shadow: none;

}

body.mado-portal-account-page .mado-support-template-popup__apply-actions button[data-mado-template-apply-save] {

    min-height: 34px;
    padding: 7px 14px;
    border: 1px solid #0284c7;
    border-radius: 999px;
    background: #0284c7;
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
    box-shadow: none;
    text-shadow: none;

}

body.mado-portal-account-page .mado-support-reply-template-editor__actions button[data-mado-reply-template-save]:hover,
body.mado-portal-account-page .mado-support-reply-template-editor__actions button[data-mado-reply-template-save]:focus-visible,
body.mado-portal-account-page .mado-support-template-popup__apply-actions button[data-mado-template-apply-save]:hover,
body.mado-portal-account-page .mado-support-template-popup__apply-actions button[data-mado-template-apply-save]:focus-visible {

    border-color: #0369a1;
    background: #0369a1;
    color: #ffffff;
    outline: none;

}

body.mado-portal-account-page .mado-support-template-popup {

    margin-top: 20px;
    padding: 12px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);

}

body.mado-portal-account-page .mado-support-template-popup__head {

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
    color: #0f172a;
    font-size: 13px;

}

body.mado-portal-account-page .mado-support-template-popup__close {

    min-height: 28px;
    padding: 4px 9px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #ffffff;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;

}

body.mado-portal-account-page .mado-support-template-popup__body {

    display: grid;
    grid-template-columns: minmax(140px, 190px) minmax(0, 1fr);
    gap: 12px;

}

body.mado-portal-account-page .mado-support-template-popup__industries {

    display: grid;
    align-content: start;
    gap: 8px;

}

body.mado-portal-account-page .mado-support-template-popup__industry {

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 32px;
    padding: 6px 10px;
    border: 1px solid #7dd3fc;
    border-radius: 999px;
    background: #ffffff;
    color: #334155;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;

}

body.mado-portal-account-page .mado-support-template-popup__industry.is-active,
body.mado-portal-account-page .mado-support-template-popup__industry:hover,
body.mado-portal-account-page .mado-support-template-popup__industry:focus-visible {

    border-color: #7dd3fc;
    background: #e0f2fe;
    color: #16325c;
    outline: none;

}

body.mado-portal-account-page .mado-support-template-popup__industry span {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    min-height: 20px;
    border-radius: 999px;
    background: rgba(14, 116, 144, 0.10);
    color: inherit;
    font-size: 11px;

}

body.mado-portal-account-page .mado-support-template-popup__industry.is-active span,
body.mado-portal-account-page .mado-support-template-popup__industry:hover span,
body.mado-portal-account-page .mado-support-template-popup__industry:focus-visible span {

    background: #ffffff;
    color: #16325c;

}

body.mado-portal-account-page .mado-support-template-popup__items {

    display: grid;
    gap: 10px;

}

body.mado-portal-account-page .mado-support-template-popup__items .mado-support-reply-template-card {

    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;

}

body.mado-portal-account-page .mado-support-template-popup__items .mado-support-reply-template-card.is-selected .mado-support-reply-template-card__insert {

    border-color: #38bdf8;
    background: #f0f9ff;
    box-shadow: 0 8px 18px rgba(14, 165, 233, 0.12);

}

body.mado-portal-account-page .mado-support-template-popup__apply {

    display: grid;
    grid-column: 1 / -1;
    gap: 10px;
    margin-top: 2px;
    padding: 12px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;

}

body.mado-portal-account-page .mado-support-template-popup__apply[hidden],
body.mado-portal-account-page .mado-support-template-popup__apply-grid label[hidden] {

    display: none;

}

body.mado-portal-account-page .mado-support-template-popup__apply-head {

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

}

body.mado-portal-account-page .mado-support-template-popup__apply-grid {

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;

}

body.mado-portal-account-page .mado-support-template-popup__apply-grid label {

    display: grid;
    gap: 5px;
    color: #334155;
    font-size: 12px;
    font-weight: 800;

}

body.mado-portal-account-page .mado-support-template-popup__apply-grid input,
body.mado-portal-account-page .mado-support-template-popup__apply-grid select,
body.mado-portal-account-page .mado-support-template-popup__apply-grid textarea {

    width: 100%;

}

body.mado-portal-account-page .mado-support-template-popup__apply-body,
body.mado-portal-account-page .mado-support-template-popup__apply-actions {

    grid-column: 1 / -1;

}

body.mado-portal-account-page .mado-support-template-popup__apply-body textarea {

    padding: 10px;
    border: 1px solid #dbeafe;
    border-radius: 8px;
    background: #ffffff;
    color: #475569;
    font-size: 12px;
    line-height: 1.55;
    min-height: 116px;
    resize: vertical;

}

body.mado-portal-account-page .mado-support-template-popup__apply-actions {

    display: flex;
    align-items: center;
    gap: 10px;
    color: #64748b;
    font-size: 13px;

}

@media (max-width: 720px) {

    body.mado-portal-account-page .mado-support-reply-template-panel__items,
    body.mado-portal-account-page .mado-support-reply-template-editor,
    body.mado-portal-account-page .mado-support-template-popup__body,
    body.mado-portal-account-page .mado-support-template-popup__apply-grid {

        grid-template-columns: minmax(0, 1fr);

    }

    .mado-portal-container .mado-support-qa-inline-panel__actions {

        flex-direction: column;
        align-items: stretch;

    }

    .mado-portal-container .mado-support-qa-inline-panel__generate.button,
    .mado-portal-container .mado-support-qa-inline-panel__transfer.button {

        width: 100%;

    }


}


/* SUPPORT TICKET ADMIN PAGE / 管理操作画面（2026-08-11）
 * - 受信箱本体の返信テンプレートUIとは別責任。
 * - この画面はCSVと社内向け管理だけを整える。返信テンプレートselectorをここへ追加しない。
 * - standalone小窓と通常portal detailの両方で同じclassを使う。
 */
body.mado-admin-window-standalone .mado-support-ticket-admin-page,
body.mado-portal-account-page .mado-support-ticket-admin-page {
    box-sizing: border-box;
    width: min(100%, 920px);
    margin: 0 auto;
    padding: 22px 24px 30px;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-title {
    margin: 0 0 16px;
    color: #0f172a;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.35;
}

.mado-support-ticket-admin-page .mado-support-ticket-csv-card {
    padding: 18px 20px;
    border: 1px solid #d8e3ed;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.mado-support-ticket-admin-page .mado-support-ticket-csv-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.mado-support-ticket-admin-page .mado-support-ticket-csv-card__title {
    margin: 0 0 4px;
    color: #0f172a;
    font-size: 16px;
    font-weight: 800;
}

.mado-support-ticket-admin-page .mado-support-ticket-csv-card__desc,
.mado-support-ticket-admin-page .mado-support-ticket-csv-card__status {
    color: #64748b;
    font-size: 12px;
    line-height: 1.55;
}

.mado-support-ticket-admin-page .mado-support-ticket-csv-card__status {
    margin-top: 8px;
}

.mado-support-ticket-admin-page .mado-support-ticket-csv-card__status.is-warning {
    color: #b45309;
}

.mado-support-ticket-admin-page .mado-support-ticket-csv-card .mado-portal-inline-heading__icon {
    display: inline-flex;
    width: 16px;
    height: 16px;
}

.mado-support-ticket-admin-page .mado-support-ticket-csv-card .mado-portal-inline-heading__icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-detail {
    margin-top: 14px;
    padding: 20px;
    border: 1px solid #d8e3ed;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-section {
    display: grid;
    gap: 16px;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5e7eb;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-section__head h2 {
    margin: 0;
    color: #0f172a;
    font-size: 16px;
    font-weight: 800;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-link {
    color: #2563eb;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-link:hover,
.mado-support-ticket-admin-page .mado-support-ticket-admin-link:focus-visible {
    text-decoration: underline;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-field {
    min-width: 0;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-field--memo {
    display: grid;
    gap: 6px;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-label {
    display: block;
    margin-bottom: 6px;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-control {
    box-sizing: border-box;
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    background: #ffffff;
    color: #0f172a;
    font-size: 14px;
    line-height: 1.35;
    box-shadow: none;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-control:focus {
    border-color: #2eb2c1;
    outline: 2px solid rgba(46, 178, 193, 0.16);
    outline-offset: 0;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-memo {
    min-height: 100px;
    resize: vertical;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-help {
    margin: 5px 0 0;
    color: #64748b;
    font-size: 11px;
    line-height: 1.5;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 2px;
}

.mado-support-ticket-admin-page .mado-support-ticket-admin-status {
    color: #64748b;
    font-size: 12px;
    line-height: 1.5;
}

@media (max-width: 760px) {
    body.mado-admin-window-standalone .mado-support-ticket-admin-page,
    body.mado-portal-account-page .mado-support-ticket-admin-page {
        padding: 16px;
    }

    .mado-support-ticket-admin-page .mado-support-ticket-admin-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .mado-support-ticket-admin-page .mado-support-ticket-csv-card__head {
        align-items: stretch;
    }
}

/* AI ASSIST GROUP / AI返信補助グループ（2026-09-02）
 * - DOM/Tab順はJS正本の「AIブラッシュ → AI返信案」。CSS orderで反転させない。
 * - 1段時は右側、containerが狭く2段になった時は検索群から少し離して第2行へ固定する。
 * - 2つのAI操作には押し間違い防止の18px間隔を確保する。
 * - AI共通gradient/animation/disabledは mado-base.css の .mado-ai-action が正本。ここへ複製しない。
 */
body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-assist-group {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    flex: 0 0 auto;
    min-width: 0;
    margin-left: auto;
    padding-left: 18px;
}

/* 返信ツールバーの唯一のlayout width rule。
 * viewport @mediaは使わず、返信パネル自身の実幅を正本にする。
 * 920pxは現行controlsの自然幅に余白を加えた境界。新しいcontrols追加時もこの1か所だけを再評価する。
 * base selectorもbody scopeを持つため、@container内も同じscopeで上書きする。低specificityへ戻すとheadがflex-nowrapのまま残り第2行が横へ押し出される。
 */
@container mado-support-reply-toolbar (max-width: 920px) {
    body.mado-portal-account-page .mado-support-reply-template-panel__head {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    body.mado-portal-account-page .mado-support-reply-toolbar-row {
        width: 100%;
        max-width: 100%;
        min-height: 40px;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: thin;
    }

    body.mado-portal-account-page .mado-support-reply-toolbar-row--secondary {
        justify-content: flex-start;
    }

    body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-assist-group {
        margin-left: 26px;
        padding-left: 0;
    }
}

/* AI PLASH UI / AIプラッシュ（2026-08-17）
 * - 正規位置はAI assist group内の先頭。AI返信案と同じ行へまとめる。
 * - countdownは残り秒数の表示だけで通信を発生させない。
 */
body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-polish-controls {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    min-width: 0;
    margin: 0;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-ai-polish-button.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-height: 32px;
    margin: 0;
    padding: 5px 12px;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    box-shadow: none;
    text-shadow: none;
    white-space: nowrap;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-polish-countdown {
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-polish-countdown[hidden] {
    display: none;
}

/* AI REPLY DRAFT UI / AI返信案（2026-08-11）
 * - 生成処理は既存Provider reply-draft routeを利用し、このCSSは受信箱のサイズ/配置だけを担当する。
 * - AIの色・動くグラデーション・disabled表現は public/css/mado-base.css の .mado-ai-action が正本。
 *   受信箱側へgradient/keyframesを複製せず、AI返信案は同じ共通classへopt-inする。
 * - AI返信案はAI assist groupだけを配置正本とし、単独の右寄せ/幅別配置をこのselectorへ戻さない。
 * - 共通「？」のpopover本体は既存MADO help-chip正本を使うため、ここへpopover CSSを複製しない。
 */
body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-controls {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    margin: 0;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-ai-reply-button.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-height: 32px;
    margin: 0;
    padding: 5px 12px;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    box-shadow: none;
    text-shadow: none;
    white-space: nowrap;
    cursor: pointer;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-help-chip {
    flex: 0 0 auto;
    margin: 0;
}


/* SUPPORT REPLY TOOLBAR HELP / 返信ツールバー「？」（2026-08-23）
 * - popover本体/arrowは既存MADO help-chipを再利用する。
 * - 説明本文は受信箱のお客様メッセージと同じ15px基準。小さい注釈文字にはしない。
 */
body .mado-support-reply-toolbar-help-content {
    color: #334155;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.8;
}

body .mado-support-reply-toolbar-help-content .mado-help-chip-popover__title {
    margin-bottom: 8px;
    color: #0f172a;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.6;
}

body .mado-support-reply-toolbar-help-content .mado-help-chip-popover__line {
    color: #334155;
    font-size: 15px;
    line-height: 1.8;
}

body .mado-support-reply-toolbar-help-content .mado-help-chip-popover__line + .mado-help-chip-popover__line {
    margin-top: 10px;
}

body .mado-support-reply-toolbar-help-content .mado-help-chip-popover__line strong {
    display: block;
    margin-bottom: 3px;
    color: #0f172a;
    font-size: 15px;
    font-weight: 700;
}

body .mado-support-reply-toolbar-help-content .mado-help-chip-popover__intro {
    margin-bottom: 8px;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-fallback-row {
    display: flex;
    align-items: center;
    margin: 10px 0 8px;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence {
    margin: 10px 0 12px;
    padding: 10px 12px;
    border: 1px solid #cfe7e3;
    border-radius: 16px;
    background: #f7fcfb;
    color: #254a47;
    font-size: 12px;
    line-height: 1.55;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence[data-tone="error"] {
    border-color: #fecaca;
    background: #fff7f7;
    color: #991b1b;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence__status {
    font-weight: 700;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence__title {
    margin-top: 6px;
    color: #0f172a;
    font-size: 12px;
    font-weight: 800;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence__row {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 5px 8px;
    margin-top: 4px;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence__label {
    color: #0f615b;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence__value {
    min-width: 0;
    overflow-wrap: anywhere;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence__caution {
    margin-top: 7px;
    padding-top: 7px;
    border-top: 1px solid #dbe9e7;
    color: #7c5b13;
}

@media (max-width: 782px) {
    body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-ai-reply-evidence__row {
        grid-template-columns: 1fr;
        gap: 1px;
    }
}

/* REPLY LIBRARY SEARCH / テンプレート・Q&A検索（2026-08-18 / 2026-08-23）
 * - テンプレート検索は既存replyTemplates cache、Q&A検索は既存site-qa GETの初回取得cacheをブラウザ内検索するUI。
 * - Q&A候補は質問文だけを表示し、クリック時だけ回答テキストを返信欄へ反映する。
 * - Q&A用の第二REST・第二DB・AI検索を作らない。両検索UIは同じshell/input/result CSSを共有する。
 * - 正規位置は「太字・リンク」の直後、「AIプラッシュ」の直前。2検索は水色の連続segmentで表示する。
 */
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search-launcher.button,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-qa-search-launcher.button {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 0;
    min-height: 40px;
    margin: 0;
    padding: 0 15px;
    border: 0;
    border-left: 1px solid var(--mado-support-reply-search-action);
    border-radius: 0;
    background: var(--mado-support-reply-search-bg);
    color: var(--mado-support-reply-search-action);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
    text-shadow: none;
    white-space: nowrap;
    cursor: pointer;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search-launcher.button:hover,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search-launcher.button:focus-visible,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search-launcher.button[aria-expanded="true"],
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-qa-search-launcher.button:hover,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-qa-search-launcher.button:focus-visible,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-qa-search-launcher.button[aria-expanded="true"] {
    border-color: var(--mado-support-reply-search-action);
    background: var(--mado-support-reply-search-bg-hover);
    color: var(--mado-support-reply-search-action-hover);
    outline: none;
    box-shadow: none;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search {
    width: min(620px, 100%);
    margin-top: 10px;
    padding: 14px;
    border: 1px solid #bae6fd;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
    box-sizing: border-box;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search[hidden] {
    display: none;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__title {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__head strong {
    display: block;
    color: #0f172a;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.4;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-toolbar-help-chip {
    flex: 0 0 auto;
    margin: 0;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search__close {
    flex: 0 0 auto;
    margin: 0;
    padding: 2px 4px;
    border: 0;
    background: transparent;
    color: #64748b;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search__close:hover,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search__close:focus-visible {
    color: #0f172a;
    outline: none;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__field {
    margin-top: 12px;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox input.mado-support-reply-template-search__input[type="search"] {
    appearance: none;
    width: 100%;
    min-height: 42px;
    box-sizing: border-box;
    margin: 0;
    padding: 9px 12px;
    border: 1px solid #94a3b8;
    border-radius: 10px;
    background: #ffffff;
    color: #0f172a;
    font: inherit;
    font-size: 14px;
    line-height: 1.35;
    box-shadow: none;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox input.mado-support-reply-template-search__input[type="search"]::placeholder {
    color: #94a3b8;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox input.mado-support-reply-template-search__input[type="search"]:focus {
    border-color: #38bdf8;
    outline: 2px solid rgba(56, 189, 248, 0.18);
    outline-offset: 0;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__results {
    display: grid;
    gap: 8px;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search__result {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 3px 10px;
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid #dbe4ee;
    border-radius: 10px;
    background: #ffffff;
    color: #0f172a;
    font: inherit;
    text-align: left;
    cursor: pointer;
    box-shadow: none;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search__result:hover,
body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search__result:focus-visible {
    border-color: #7dd3fc;
    background: #f0f9ff;
    outline: none;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search__result--question-only {
    grid-template-columns: minmax(0, 1fr);
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__result-title {
    min-width: 0;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.4;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__result-meta {
    color: #0f766e;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    white-space: nowrap;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__result-preview {
    grid-column: 1 / -1;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__empty {
    margin: 0;
    padding: 10px 12px;
    border-radius: 9px;
    background: #f8fafc;
    color: #64748b;
    font-size: 12px;
    line-height: 1.6;
}

body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__empty.is-error {
    background: #fff7ed;
    color: #9a3412;
}

@media (max-width: 640px) {
    body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search {
        width: 100%;
    }

    body.mado-portal-account-page .mado-portal-shell--action-support-inbox button.mado-support-reply-template-search__result {
        grid-template-columns: minmax(0, 1fr);
    }

    body.mado-portal-account-page .mado-portal-shell--action-support-inbox .mado-support-reply-template-search__result-meta {
        white-space: normal;
    }
}