/* ============================================================
   custom-card TagHelper 専用スタイル
   依存: Bootstrap 5 の .card / .collapse / .show
   ============================================================ */

/* ----------------------------------------------------------
   ベースカード
   ---------------------------------------------------------- */
.card {
    border: 1px solid var(--card-border);
    background-color: var(--card-fr-color);
}

    .card .collapsing {
        transition-duration: 80ms !important;
    }

    /* ----------------------------------------------------------
       カードヘッダー
       ---------------------------------------------------------- */
    .card .card-header {
        display: flex;
        align-items: center;
        padding: 0.6rem 1rem;
        background-color: var(--card-header-bg-color);
        border-bottom: 1px solid var(--card-border);
        font-weight: 600;
    }

        /* ----------------------------------------------------------
           折り畳みヘッダー（Collapse=true のとき付与されるクラス）
           ---------------------------------------------------------- */
        .card .card-header.card-collapse {
            cursor: pointer;
            user-select: none;
            justify-content: space-between;
        }

            .card .card-header.card-collapse[aria-expanded="false"] {
                border-radius: inherit;
                border-bottom-style: none;
            }

            .card .card-header.card-collapse .card-collapse-icon {
                margin-left: 0.75rem;
                flex-shrink: 0;
                transition: transform 180ms ease;
            }

            .card .card-header.card-collapse[aria-expanded="false"] .card-collapse-icon {
                transform: rotate(180deg);
            }