﻿body {
}


/* ── 버튼 스타일 리셋 ── */
/* ─────────────────────────
   ICT Button Base
───────────────────────── */

.dx-button.ictBtn {
    border-radius: 8px;
    border-width: 1px;
    border-style: solid;
    font-weight: 500;
    line-height: 1;
    min-height: 37px;
    align-content: center;
    align-items: center;
    cursor: pointer;
/*    box-shadow: 0 4px 9px rgba(37, 99, 235, .22);*/
    box-shadow: 0 4px 9px rgb(125 128 134 / 22%);
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease, background-color .14s ease, border-color .14s ease, color .14s ease;
}

    .dx-button.ictBtn .dx-button-text,
    .dx-button.ictBtn .dx-icon {
        line-height: 1;
    }

    .dx-button.ictBtn.dx-state-hover {
        transform: translateY(-1px);
        filter: brightness(1.03);
    }

    .dx-button.ictBtn.dx-state-active {
        transform: translateY(0);
        filter: brightness(.97);
    }

.dx-state-disabled .dx-button.ictBtn,
.dx-state-disabled.dx-button.ictBtn {
    cursor: default;
    transform: none;
    filter: none;
    box-shadow: none;
}

    .dx-state-disabled .dx-button.ictBtn .dx-icon,
    .dx-state-disabled.dx-button.ictBtn .dx-icon,
    .dx-state-disabled .dx-button.ictBtn .dx-button-text,
    .dx-state-disabled.dx-button.ictBtn .dx-button-text {
        opacity: .45;
    }


/* ─────────────────────────
   Contained - Base / Normal
   일반 기본 버튼
───────────────────────── */

.ictBtn-contained,
.ictBtn-contained.ictBtn-normal {
    background: #FFFFFF;
    border-color: #D6DCE3;
    color: #333333;
    box-shadow: 0 2px 5px rgba(15, 23, 42, .06);
}

    .ictBtn-contained .dx-icon,
    .ictBtn-contained.ictBtn-normal .dx-icon {
        color: #333333;
    }

    .ictBtn-contained.dx-state-hover,
    .ictBtn-contained.ictBtn-normal.dx-state-hover {
        background: #F7F8FA;
        border-color: #C4CCD6;
        color: #2B2B2B;
        box-shadow: 0 4px 6px rgba(15, 23, 42, .10);
    }

    .ictBtn-contained.dx-state-focused,
    .ictBtn-contained.ictBtn-normal.dx-state-focused {
        background: #F1F4F7;
        border-color: #AEB8C4;
        color: #2B2B2B;
        box-shadow: 0 0 0 3px rgba(100, 116, 139, .15), 0 2px 5px rgba(15, 23, 42, .06);
    }

    .ictBtn-contained.dx-state-active,
    .ictBtn-contained.ictBtn-normal.dx-state-active {
        background: #E3E8EE;
        border-color: #9EAAB7;
        color: #222222;
        box-shadow: 0 1px 3px rgba(15, 23, 42, .10);
    }


    /* ─────────────────────────
   Contained - Default / Primary
   메인 파란 버튼
───────────────────────── */

    .ictBtn-contained.ictBtn-default {
        background: linear-gradient(135deg, #2F7DF6 0%, #2563EB 100%) !important;
        border-color: transparent;
        color: #FFFFFF !important;
        box-shadow: 0 4px 9px rgba(37, 99, 235, .22);
    }

        .ictBtn-contained.ictBtn-default .dx-icon {
            color: #FFFFFF !important;
        }

        .ictBtn-contained.ictBtn-default.dx-state-hover {
            background: linear-gradient(135deg, #2F7DF6 0%, #2563EB 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 4px 6px rgba(37, 99, 235, .22);
        }

        .ictBtn-contained.ictBtn-default.dx-state-focused {
            background: linear-gradient(135deg, #2F7DF6 0%, #2563EB 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 0 0 3px rgba(37, 99, 235, .18), 0 4px 6px rgba(37, 99, 235, .22);
        }

        .ictBtn-contained.ictBtn-default.dx-state-active {
            background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 2px 4px rgba(37, 99, 235, .18);
        }


    /* ─────────────────────────
   Contained - Success
───────────────────────── */

    .ictBtn-contained.ictBtn-success {
        background: linear-gradient(135deg, #22B981 0%, #159A68 100%) !important;
        border-color: transparent;
        color: #FFFFFF !important;
        box-shadow: 0 4px 9px rgba(21, 154, 104, .22);
    }

        .ictBtn-contained.ictBtn-success .dx-icon {
            color: #FFFFFF !important;
        }

        .ictBtn-contained.ictBtn-success.dx-state-hover {
            background: linear-gradient(135deg, #22B981 0%, #159A68 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 4px 6px rgba(21, 154, 104, .22);
        }

        .ictBtn-contained.ictBtn-success.dx-state-focused {
            background: linear-gradient(135deg, #22B981 0%, #159A68 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 0 0 3px rgba(21, 154, 104, .18), 0 4px 6px rgba(21, 154, 104, .22);
        }

        .ictBtn-contained.ictBtn-success.dx-state-active {
            background: linear-gradient(135deg, #159A68 0%, #0F724E 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 2px 4px rgba(21, 154, 104, .18);
        }


    /* ─────────────────────────
   Contained - Danger
───────────────────────── */

    .ictBtn-contained.ictBtn-danger {
        background: linear-gradient(135deg, #EF6A6A 0%, #DC3F3F 100%) !important;
        border-color: transparent;
        color: #FFFFFF !important;
        box-shadow: 0 4px 9px rgba(220, 63, 63, .22);
    }

        .ictBtn-contained.ictBtn-danger .dx-icon {
            color: #FFFFFF !important;
        }

        .ictBtn-contained.ictBtn-danger.dx-state-hover {
            background: linear-gradient(135deg, #EF6A6A 0%, #DC3F3F 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 4px 6px rgba(220, 63, 63, .22);
        }

        .ictBtn-contained.ictBtn-danger.dx-state-focused {
            background: linear-gradient(135deg, #EF6A6A 0%, #DC3F3F 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 0 0 3px rgba(220, 63, 63, .18), 0 4px 6px rgba(220, 63, 63, .22);
        }

        .ictBtn-contained.ictBtn-danger.dx-state-active {
            background: linear-gradient(135deg, #DC3F3F 0%, #A92E2E 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 2px 4px rgba(220, 63, 63, .18);
        }


    /* ─────────────────────────
   Contained - Warning
───────────────────────── */

    .ictBtn-contained.ictBtn-warning {
        background: linear-gradient(135deg, #F6B94B 0%, #EA9A19 100%) !important;
        border-color: transparent;
        color: #FFFFFF !important;
        box-shadow: 0 4px 9px rgba(234, 154, 25, .24);
    }

        .ictBtn-contained.ictBtn-warning .dx-icon {
            color: #FFFFFF !important;
        }

        .ictBtn-contained.ictBtn-warning.dx-state-hover {
            background: linear-gradient(135deg, #F6B94B 0%, #EA9A19 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 4px 6px rgba(234, 154, 25, .24);
        }

        .ictBtn-contained.ictBtn-warning.dx-state-focused {
            background: linear-gradient(135deg, #F6B94B 0%, #EA9A19 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 0 0 3px rgba(234, 154, 25, .20), 0 4px 6px rgba(234, 154, 25, .24);
        }

        .ictBtn-contained.ictBtn-warning.dx-state-active {
            background: linear-gradient(135deg, #EA9A19 0%, #B96E0D 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 2px 4px rgba(234, 154, 25, .18);
        }


    /* ─────────────────────────
   Contained - Info
───────────────────────── */

    .ictBtn-contained.ictBtn-info {
        background: linear-gradient(135deg, #25B7D3 0%, #1593B1 100%) !important;
        border-color: transparent;
        color: #FFFFFF !important;
        box-shadow: 0 4px 9px rgba(21, 147, 177, .22);
    }

        .ictBtn-contained.ictBtn-info .dx-icon {
            color: #FFFFFF !important;
        }

        .ictBtn-contained.ictBtn-info.dx-state-hover {
            background: linear-gradient(135deg, #25B7D3 0%, #1593B1 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 4px 6px rgba(21, 147, 177, .22);
        }

        .ictBtn-contained.ictBtn-info.dx-state-focused {
            background: linear-gradient(135deg, #25B7D3 0%, #1593B1 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 0 0 3px rgba(21, 147, 177, .18), 0 4px 6px rgba(21, 147, 177, .22);
        }

        .ictBtn-contained.ictBtn-info.dx-state-active {
            background: linear-gradient(135deg, #1593B1 0%, #0F6A80 100%) !important;
            border-color: transparent;
            color: #FFFFFF !important;
            box-shadow: 0 2px 4px rgba(21, 147, 177, .18);
        }


/* ─────────────────────────
   Outlined - Base / Normal
───────────────────────── */

.ictBtn-outlined,
.ictBtn-outlined.ictBtn-normal {
    background-color: rgba(51, 65, 85, .04);
    border-color: #D6DCE3;
    color: #334155;
/*    box-shadow: none;*/
}

    .ictBtn-outlined .dx-icon,
    .ictBtn-outlined.ictBtn-normal .dx-icon {
        color: #334155;
    }

    .ictBtn-outlined.dx-state-hover,
    .ictBtn-outlined.ictBtn-normal.dx-state-hover {
        background-color: rgba(51, 65, 85, .07);
        border-color: #B8C2CC;
        color: #1E293B;
        box-shadow: 0 4px 6px rgba(15, 23, 42, .08);
    }

    .ictBtn-outlined.dx-state-focused,
    .ictBtn-outlined.ictBtn-normal.dx-state-focused {
        background-color: rgba(51, 65, 85, .07);
        border-color: #94A3B8;
        color: #1E293B;
        box-shadow: 0 0 0 3px rgba(100, 116, 139, .14);
    }

    .ictBtn-outlined.dx-state-active,
    .ictBtn-outlined.ictBtn-normal.dx-state-active {
        background-color: rgba(51, 65, 85, .13);
        border-color: #94A3B8;
        color: #1E293B;
    }


    /* ─────────────────────────
   Outlined - Default / Primary
───────────────────────── */

    .ictBtn-outlined.ictBtn-default {
        background-color: #f2f6fe;
        border-color: #2563EB;
        color: #1D4ED8;
    }

        .ictBtn-outlined.ictBtn-default .dx-icon {
            color: #1D4ED8;
        }

        .ictBtn-outlined.ictBtn-default.dx-state-hover {
            background-color: rgba(37, 99, 235, .12);
            border-color: #1D4ED8;
            color: #1D4ED8;
            box-shadow: 0 4px 6px rgba(37, 99, 235, .14);
        }

        .ictBtn-outlined.ictBtn-default.dx-state-focused {
            background-color: rgba(37, 99, 235, .10);
            border-color: #1D4ED8;
            color: #1D4ED8;
            box-shadow: 0 0 0 3px rgba(37, 99, 235, .16);
        }

        .ictBtn-outlined.ictBtn-default.dx-state-active {
            background-color: rgba(37, 99, 235, .22);
            border-color: #1E40AF;
            color: #1E40AF;
        }


    /* ─────────────────────────
   Outlined - Success
───────────────────────── */

    .ictBtn-outlined.ictBtn-success {
        background-color: rgba(21, 154, 104, .07);
        border-color: #159A68;
        color: #137A55;
    }

        .ictBtn-outlined.ictBtn-success .dx-icon {
            color: #137A55;
        }

        .ictBtn-outlined.ictBtn-success.dx-state-hover {
            background-color: rgba(21, 154, 104, .13);
            border-color: #12875D;
            color: #116C4B;
            box-shadow: 0 4px 6px rgba(21, 154, 104, .14);
        }

        .ictBtn-outlined.ictBtn-success.dx-state-focused {
            background-color: rgba(21, 154, 104, .10);
            border-color: #12875D;
            color: #116C4B;
            box-shadow: 0 0 0 3px rgba(21, 154, 104, .16);
        }

        .ictBtn-outlined.ictBtn-success.dx-state-active {
            background-color: rgba(21, 154, 104, .23);
            border-color: #0F724E;
            color: #0F724E;
        }


    /* ─────────────────────────
   Outlined - Danger
───────────────────────── */

    .ictBtn-outlined.ictBtn-danger {
        background-color: rgba(220, 63, 63, .07);
        border-color: #DC3F3F;
        color: #C23535;
    }

        .ictBtn-outlined.ictBtn-danger .dx-icon {
            color: #C23535;
        }

        .ictBtn-outlined.ictBtn-danger.dx-state-hover {
            background-color: rgba(220, 63, 63, .13);
            border-color: #C92F2F;
            color: #B52A2A;
            box-shadow: 0 4px 6px rgba(220, 63, 63, .14);
        }

        .ictBtn-outlined.ictBtn-danger.dx-state-focused {
            background-color: rgba(220, 63, 63, .10);
            border-color: #C92F2F;
            color: #B52A2A;
            box-shadow: 0 0 0 3px rgba(220, 63, 63, .16);
        }

        .ictBtn-outlined.ictBtn-danger.dx-state-active {
            background-color: rgba(220, 63, 63, .23);
            border-color: #A92E2E;
            color: #A92E2E;
        }


    /* ─────────────────────────
   Outlined - Warning
───────────────────────── */

    .ictBtn-outlined.ictBtn-warning {
        background-color: rgba(234, 154, 25, .09);
        border-color: #EA9A19;
        color: #B96E0D;
    }

        .ictBtn-outlined.ictBtn-warning .dx-icon {
            color: #B96E0D;
        }

        .ictBtn-outlined.ictBtn-warning.dx-state-hover {
            background-color: rgba(234, 154, 25, .16);
            border-color: #D8870F;
            color: #A25F0C;
            box-shadow: 0 4px 6px rgba(234, 154, 25, .15);
        }

        .ictBtn-outlined.ictBtn-warning.dx-state-focused {
            background-color: rgba(234, 154, 25, .12);
            border-color: #D8870F;
            color: #A25F0C;
            box-shadow: 0 0 0 3px rgba(234, 154, 25, .17);
        }

        .ictBtn-outlined.ictBtn-warning.dx-state-active {
            background-color: rgba(234, 154, 25, .26);
            border-color: #8A500A;
            color: #8A500A;
        }


    /* ─────────────────────────
   Outlined - Info
───────────────────────── */

    .ictBtn-outlined.ictBtn-info {
        background-color: rgba(21, 147, 177, .08);
        border-color: #1593B1;
        color: #107E99;
    }

        .ictBtn-outlined.ictBtn-info .dx-icon {
            color: #107E99;
        }

        .ictBtn-outlined.ictBtn-info.dx-state-hover {
            background-color: rgba(21, 147, 177, .15);
            border-color: #107E99;
            color: #0F6A80;
            box-shadow: 0 4px 6px rgba(21, 147, 177, .14);
        }

        .ictBtn-outlined.ictBtn-info.dx-state-focused {
            background-color: rgba(21, 147, 177, .11);
            border-color: #107E99;
            color: #0F6A80;
            box-shadow: 0 0 0 3px rgba(21, 147, 177, .16);
        }

        .ictBtn-outlined.ictBtn-info.dx-state-active {
            background-color: rgba(21, 147, 177, .25);
            border-color: #0D586A;
            color: #0D586A;
        }


/* ─────────────────────────
   Text - Base / Normal
───────────────────────── */

.ictBtn-text,
.ictBtn-text.ictBtn-normal {
    background-color: transparent;
    border-color: transparent;
    color: #334155;
    box-shadow: none;
}

    .ictBtn-text .dx-icon,
    .ictBtn-text.ictBtn-normal .dx-icon {
        color: #334155;
    }

    .ictBtn-text.dx-state-hover,
    .ictBtn-text.ictBtn-normal.dx-state-hover {
        background-color: rgba(51, 65, 85, .07);
        color: #1E293B;
        box-shadow: none;
    }

    .ictBtn-text.dx-state-focused,
    .ictBtn-text.ictBtn-normal.dx-state-focused {
        background-color: rgba(51, 65, 85, .10);
        color: #1E293B;
        box-shadow: 0 0 0 3px rgba(100, 116, 139, .12);
    }

    .ictBtn-text.dx-state-active,
    .ictBtn-text.ictBtn-normal.dx-state-active {
        background-color: rgba(51, 65, 85, .16);
        color: #1E293B;
    }


    /* ─────────────────────────
   Text - Default / Primary
───────────────────────── */

    .ictBtn-text.ictBtn-default {
        background-color: transparent;
        border-color: transparent;
        color: #1D4ED8;
    }

        .ictBtn-text.ictBtn-default .dx-icon {
            color: #1D4ED8;
        }

        .ictBtn-text.ictBtn-default.dx-state-hover {
            background-color: rgba(37, 99, 235, .10);
            color: #1D4ED8;
        }

        .ictBtn-text.ictBtn-default.dx-state-focused {
            background-color: rgba(37, 99, 235, .10);
            color: #1D4ED8;
            box-shadow: 0 0 0 3px rgba(37, 99, 235, .14);
        }

        .ictBtn-text.ictBtn-default.dx-state-active {
            background-color: rgba(37, 99, 235, .20);
            color: #1E40AF;
        }


    /* ─────────────────────────
   Text - Success
───────────────────────── */

    .ictBtn-text.ictBtn-success {
        background-color: transparent;
        border-color: transparent;
        color: #137A55;
    }

        .ictBtn-text.ictBtn-success .dx-icon {
            color: #137A55;
        }

        .ictBtn-text.ictBtn-success.dx-state-hover {
            background-color: rgba(21, 154, 104, .10);
            color: #116C4B;
        }

        .ictBtn-text.ictBtn-success.dx-state-focused {
            background-color: rgba(21, 154, 104, .10);
            color: #116C4B;
            box-shadow: 0 0 0 3px rgba(21, 154, 104, .14);
        }

        .ictBtn-text.ictBtn-success.dx-state-active {
            background-color: rgba(21, 154, 104, .20);
            color: #0F724E;
        }


    /* ─────────────────────────
   Text - Danger
───────────────────────── */

    .ictBtn-text.ictBtn-danger {
        background-color: transparent;
        border-color: transparent;
        color: #C23535;
    }

        .ictBtn-text.ictBtn-danger .dx-icon {
            color: #C23535;
        }

        .ictBtn-text.ictBtn-danger.dx-state-hover {
            background-color: rgba(220, 63, 63, .10);
            color: #B52A2A;
        }

        .ictBtn-text.ictBtn-danger.dx-state-focused {
            background-color: rgba(220, 63, 63, .10);
            color: #B52A2A;
            box-shadow: 0 0 0 3px rgba(220, 63, 63, .14);
        }

        .ictBtn-text.ictBtn-danger.dx-state-active {
            background-color: rgba(220, 63, 63, .20);
            color: #A92E2E;
        }


    /* ─────────────────────────
   Text - Warning
───────────────────────── */

    .ictBtn-text.ictBtn-warning {
        background-color: transparent;
        border-color: transparent;
        color: #B96E0D;
    }

        .ictBtn-text.ictBtn-warning .dx-icon {
            color: #B96E0D;
        }

        .ictBtn-text.ictBtn-warning.dx-state-hover {
            background-color: rgba(234, 154, 25, .12);
            color: #A25F0C;
        }

        .ictBtn-text.ictBtn-warning.dx-state-focused {
            background-color: rgba(234, 154, 25, .12);
            color: #A25F0C;
            box-shadow: 0 0 0 3px rgba(234, 154, 25, .15);
        }

        .ictBtn-text.ictBtn-warning.dx-state-active {
            background-color: rgba(234, 154, 25, .22);
            color: #8A500A;
        }


    /* ─────────────────────────
   Text - Info
───────────────────────── */

    .ictBtn-text.ictBtn-info {
        background-color: transparent;
        border-color: transparent;
        color: #107E99;
    }

        .ictBtn-text.ictBtn-info .dx-icon {
            color: #107E99;
        }

        .ictBtn-text.ictBtn-info.dx-state-hover {
            background-color: rgba(21, 147, 177, .12);
            color: #0F6A80;
        }

        .ictBtn-text.ictBtn-info.dx-state-focused {
            background-color: rgba(21, 147, 177, .12);
            color: #0F6A80;
            box-shadow: 0 0 0 3px rgba(21, 147, 177, .14);
        }

        .ictBtn-text.ictBtn-info.dx-state-active {
            background-color: rgba(21, 147, 177, .22);
            color: #0D586A;
        }
