/*!
 * Extracted from legacy SCTUPGRADE/SCTNT1-NEX/index.php
 * Source range: L1053–L1159
 * Description: Grid layout untuk transaksi-group
 * DO NOT edit manually — regenerate via SCTV1/extract_css.php
 */

    .transaksi-group {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-areas:
      "transaksi-bank"
      "transaksi-other";
      gap: 16px;
    }

    .transaksi-header {
      font-size: 1.1rem;
      height: 36px;
    }

    .transaksi-list-bank {
      grid-template-columns: repeat(4, 1fr);
    }

    .transaksi-list-other {
      grid-template-columns: repeat(4, 1fr);
    }

    .transaksi-list {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
    }

    .transaksi-item {
      width: 100%;
    }

    .transaksi-title-group {
      justify-content: center;
      padding: 16px 0;
    }

    .transaksi-name {
      font-size: 1.3rem;
      text-align: center;    
    }

    .transaksi-wrapper {
      width: 100%;
      max-width: 100%!important;
      gap: 1rem;
    }
    
    .btn-danger {
         padding: 10px 26px;
         display: block;
         line-height: 22px;
         box-shadow: inset 0 0 5px 3px #001680, inset 0 2px 0 0 #fff, inset 0 0 0 2px #110080, 3px 3px 3px 1px rgba(0, 0, 0, .2);
         background-image: linear-gradient(195deg, rgb(2, 40, 255) 11%,rgb(58, 242, 255) 21%, rgb(2, 40, 255) 33%,rgb(2, 40, 255) 30%,rgb(2, 40, 255) 60%, rgb(58, 242, 255) 73%, rgb(2, 40, 255) 85%, rgb(2, 40, 255) 100%);
         border: 1px solid #0068ff !important;
         animation: background-gold 3s infinite;
         background-size: 300% 300%;
         color: #fff;
         border-width: 0;
         border-radius: 10px;
         font-weight: 700;
         font-size: 18px;
         text-align: center;
         text-shadow: 2px 1px 9px rgb(0 0 0 / 80%);
         margin-bottom: 12px;
         margin-top: 15px;
    }
    
    .btn-success {
          padding: 10px 26px;
         display: block;
         line-height: 22px;
         box-shadow: inset 0 0 5px 3px #bc9800, inset 0 2px 0 0 #fff, inset 0 0 0 2px #d1c300, 3px 3px 3px 1px rgba(0, 0, 0, .2);
         background-image: linear-gradient(195deg, rgb(255 202 2) 11%,rgb(255, 240, 33) 21%, rgb(255 202 2) 33%,rgb(255 202 2) 30%,rgb(255 202 2) 60%, rgb(255, 240, 33) 73%, rgb(255 202 2) 85%, rgb(255 202 2) 100%);
         border: 1px solid #d5d000 !important;
         animation: background-gold 3s infinite;
         background-size: 300% 300%;
         color: #fff;
         border-width: 0;
         border-radius: 10px;
         font-weight: 700;
         font-size: 18px;
         text-align: center;
         text-shadow: 2px 1px 9px rgb(0 0 0 / 80%);
         margin-bottom: 12px;
         margin-top: 15px;
    }
    .btn-primary {
                    padding: 10px 26px;
         display: block;
         line-height: 22px;
         box-shadow: inset 0 0 5px 3px #258000, inset 0 2px 0 0 #fff, inset 0 0 0 2px #29eb00, 3px 3px 3px 1px rgba(0, 0, 0, .2);
         background-image: linear-gradient(195deg, rgb(22, 190, 0) 11%,rgb(0, 238, 0) 21%, rgb(22, 190, 0) 33%,rgb(22, 190, 0) 30%,rgb(22, 190, 0) 60%, rgb(0, 238, 0) 73%, rgb(22, 190, 0) 85%, rgb(22, 190, 0) 100%);
         border: 1px solid #23d500 !important;
         animation: background-gold 3s infinite;
         background-size: 300% 300%;
         color: #fff;
         border-width: 0;
         border-radius: 10px;
         font-weight: 700;
         font-size: 18px;
         text-align: center;
         text-shadow: 2px 1px 9px rgb(0 0 0 / 70%);
         margin-bottom: 12px;
         margin-top: 15px;
    }