/*==================================================
  TORQUELINE MOTORS
  ESIN PAYMENT GATEWAYS
  CHECKOUT
  VERSION 2.1
==================================================*/


/*==================================================
  PAYMENT METHODS WRAPPER
==================================================*/

.woocommerce-checkout .wc_payment_methods{
    width:100%;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
}

.woocommerce-checkout .wc_payment_methods li.wc_payment_method{
    width:100%;
    margin:0 0 12px !important;
    padding:0 !important;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-radius:6px;

    box-sizing:border-box;
    overflow:hidden;

    box-shadow:0 4px 16px rgba(16,19,24,.04);

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.woocommerce-checkout .wc_payment_methods li.wc_payment_method:hover{
    border-color:#C9CDD2;
}

.woocommerce-checkout .wc_payment_methods li.wc_payment_method:has(
    input[name="payment_method"]:checked
){
    border-color:#101318;

    box-shadow:0 5px 20px rgba(16,19,24,.07);
}


/*==================================================
  PAYMENT METHOD HEADER
==================================================*/

.woocommerce-checkout
.wc_payment_methods
li.wc_payment_method
> input[type="radio"]{
    margin-left:18px !important;
}

.woocommerce-checkout
.wc_payment_methods
li.wc_payment_method
> label{
    min-height:58px;

    display:inline-flex !important;
    align-items:center;

    margin:0 !important;
    padding:16px 18px 16px 8px;

    box-sizing:border-box;

    font-family:"Inter",sans-serif;
    font-size:14px;
    font-weight:700;
    line-height:1.3;

    color:#101318 !important;

    cursor:pointer;
}


/*==================================================
  RADIO BUTTON
==================================================*/

.woocommerce-checkout
.wc_payment_methods
input[name="payment_method"]{
    width:16px !important;
    height:16px !important;
    min-width:16px;

    accent-color:#E42A2D;

    cursor:pointer;
}


/*==================================================
  PAYMENT METHOD ICONS
==================================================*/

.payment_method_esin_bank_instructions > label::before{
    content:"";

    width:30px;
    height:30px;
    flex:0 0 30px;

    margin-right:10px;

    border-radius:50%;

    background:
        #101318
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 10 9-7 9 7'/%3E%3Cpath d='M5 10v9'/%3E%3Cpath d='M9 10v9'/%3E%3Cpath d='M15 10v9'/%3E%3Cpath d='M19 10v9'/%3E%3Cpath d='M3 19h18'/%3E%3C/svg%3E")
        center / 15px 15px
        no-repeat;
}

.payment_method_esin_crypto > label::before{
    content:"₿";

    width:30px;
    height:30px;
    flex:0 0 30px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-right:10px;

    background:#101318;

    border-radius:50%;

    font-family:Arial,sans-serif;
    font-size:17px;
    font-weight:700;
    line-height:1;

    color:#FFFFFF !important;
}


/*==================================================
  PAYMENT BOX
==================================================*/

.woocommerce-checkout
.wc_payment_methods
.payment_box{
    position:relative !important;

    width:auto !important;

    margin:0 !important;
    padding:0 !important;

    background:#FFFFFF !important;

    border:none !important;
    border-radius:0 !important;

    color:#101318 !important;

    box-shadow:none !important;
}

.woocommerce-checkout
.wc_payment_methods
.payment_box::before{
    display:none !important;
    content:none !important;
}


/*==================================================
  INNER PANELS
==================================================*/

.esin-bank-panel,
.esin-crypto-panel{
    width:100%;

    padding:22px;

    background:#F7F8F9;

    border-top:1px solid #E1E4E7;

    box-sizing:border-box;
}


/*==================================================
  PAYMENT INTRO
==================================================*/

.esin-payment-intro{
    margin:0 0 20px;
}

.esin-payment-eyebrow{
    display:block;

    margin:0 0 6px;

    font-family:"Inter",sans-serif;
    font-size:11px;
    font-weight:800;
    line-height:1.2;
    letter-spacing:1.4px;

    color:#E42A2D !important;

    text-transform:uppercase;
}

.esin-payment-intro h3{
    margin:0 0 7px !important;
    padding:0 !important;

    font-family:"Barlow Condensed",sans-serif !important;
    font-size:25px !important;
    font-weight:700 !important;
    line-height:1.05 !important;

    text-transform:uppercase;

    color:#101318 !important;
}

.esin-payment-description{
    margin:0;
}

.esin-payment-description p{
    margin:0 !important;

    font-family:"Inter",sans-serif;
    font-size:14px !important;
    font-weight:400;
    line-height:1.6;

    color:#606872 !important;
}


/*==================================================
  CRYPTO DISCOUNT
==================================================*/

.esin-discount-box{
    width:100%;

    display:flex;
    align-items:center;

    gap:12px;

    margin:0 0 20px;
    padding:13px 15px;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-left:3px solid #E42A2D;
    border-radius:4px;

    box-sizing:border-box;
}

.esin-discount-icon{
    width:34px;
    height:34px;
    flex:0 0 34px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#101318;

    border-radius:50%;

    font-family:"Inter",sans-serif;
    font-size:14px;
    font-weight:800;

    color:#FFFFFF !important;
}

.esin-discount-box div{
    min-width:0;
}

.esin-discount-box small{
    display:block;

    margin:0 0 2px;

    font-family:"Inter",sans-serif;
    font-size:11px;
    font-weight:700;
    letter-spacing:1px;

    color:#737A83 !important;

    text-transform:uppercase;
}

.esin-discount-box strong{
    display:block;

    font-family:"Inter",sans-serif;
    font-size:13px;
    font-weight:700;
    line-height:1.4;

    color:#101318 !important;
}


/*==================================================
  FIELD GROUPS
==================================================*/

.esin-field-group{
    width:100%;
    margin:0 0 18px;
}

.esin-field-group > label{
    display:block !important;

    min-height:0 !important;

    margin:0 0 7px !important;
    padding:0 !important;

    cursor:default !important;
}

.esin-field-group > label > span{
    display:block;

    margin:0 0 2px;

    font-family:"Inter",sans-serif;
    font-size:13px;
    font-weight:700;
    line-height:1.3;

    color:#101318 !important;
}

.esin-field-group > label > small{
    display:block;

    font-family:"Inter",sans-serif;
    font-size:11px;
    font-weight:400;
    line-height:1.4;

    color:#7A818A !important;
}

.esin-field-group label em{
    font-style:normal;
    color:#E42A2D !important;
}


/*==================================================
  CRYPTO INPUTS
==================================================*/

.payment_method_esin_crypto #esin_crypto_coin,
.payment_method_esin_crypto #esin-wallet-input,
.payment_method_esin_crypto #esin-crypto-amount,
.payment_method_esin_crypto #esin_crypto_txid{
    width:100% !important;
    max-width:100% !important;

    min-height:48px;

    margin:0 !important;
    padding:0 14px !important;

    background:#FFFFFF !important;

    border:1px solid #D9DDE1 !important;
    border-radius:4px !important;

    outline:none !important;
    box-shadow:none !important;

    box-sizing:border-box;

    font-family:"Inter",sans-serif !important;
    font-size:14px !important;
    font-weight:500;
    line-height:1.4;

    color:#101318 !important;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.payment_method_esin_crypto #esin_crypto_coin:focus,
.payment_method_esin_crypto #esin_crypto_txid:focus{
    border-color:#101318 !important;

    box-shadow:0 0 0 2px rgba(16,19,24,.05) !important;
}

.payment_method_esin_crypto #esin-wallet-input,
.payment_method_esin_crypto #esin-crypto-amount{
    background:#F0F2F4 !important;
    color:#30363D !important;
}

.payment_method_esin_crypto #esin_crypto_txid::placeholder{
    color:#9299A1 !important;
    opacity:1;
}


/*==================================================
  WALLET BOX
==================================================*/

#esin-crypto-wallet-box{
    width:100%;

    margin:0;
    padding:0;

    background:transparent;

    border:none;

    box-sizing:border-box;
}


/*==================================================
  WALLET ROW + COPY BUTTON
==================================================*/

.esin-wallet-row{
    width:100%;

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

    gap:8px;

    align-items:stretch;
}

.esin-copy-btn{
    width:100%;
    min-height:48px;

    margin:0 !important;
    padding:0 12px !important;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#101318 !important;

    border:1px solid #101318 !important;
    border-radius:4px !important;

    box-shadow:none !important;

    font-family:"Inter",sans-serif !important;
    font-size:12px !important;
    font-weight:700 !important;
    line-height:1;

    color:#FFFFFF !important;

    cursor:pointer;

    transition:
        background .2s ease,
        border-color .2s ease;
}

.esin-copy-btn:hover{
    background:#E42A2D !important;
    border-color:#E42A2D !important;

    color:#FFFFFF !important;
}


/*==================================================
  NETWORK BADGE
==================================================*/

.esin-network-badge{
    width:max-content;
    max-width:100%;

    display:flex;
    align-items:center;

    gap:8px;

    margin:-7px 0 18px;
    padding:6px 9px;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-radius:3px;

    box-sizing:border-box;
}

.esin-network-badge:empty{
    display:none;
}

.esin-network-badge span{
    font-family:"Inter",sans-serif;
    font-size:10px;
    font-weight:600;
    letter-spacing:.6px;

    color:#7A818A !important;

    text-transform:uppercase;
}

.esin-network-badge strong{
    font-family:"Inter",sans-serif;
    font-size:11px;
    font-weight:700;

    color:#101318 !important;
}


/*==================================================
  QR CARD
==================================================*/

.esin-qr-card{
    width:100%;

    margin:0 0 18px;
    padding:17px;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-radius:4px;

    box-sizing:border-box;
}

.esin-qr-heading{
    margin:0 0 14px;
    text-align:center;
}

.esin-qr-heading span{
    display:block;

    margin:0 0 3px;

    font-family:"Barlow Condensed",sans-serif;
    font-size:20px;
    font-weight:700;
    line-height:1;

    text-transform:uppercase;

    color:#101318 !important;
}

.esin-qr-heading small{
    display:block;

    font-family:"Inter",sans-serif;
    font-size:11px;
    font-weight:400;
    line-height:1.4;

    color:#7A818A !important;
}

#esin-qr{
    min-height:150px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin:0 !important;
}

#esin-qr img,
#esin-qr canvas{
    display:block !important;

    width:150px !important;
    height:150px !important;
    max-width:100% !important;

    margin:0 auto !important;
}


/*==================================================
  PROOF UPLOAD
==================================================*/

.esin-proof-group{
    margin-bottom:16px;
}

#esin_crypto_proof{
    display:block;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:8px !important;

    background:#FFFFFF;

    border:1px solid #D9DDE1;
    border-radius:4px;

    box-sizing:border-box;

    font-family:"Inter",sans-serif;
    font-size:13px;

    color:#505861;
}

#esin_crypto_proof::file-selector-button{
    margin-right:10px;
    padding:9px 13px;

    background:#101318;

    border:none;
    border-radius:3px;

    font-family:"Inter",sans-serif;
    font-size:11px;
    font-weight:700;

    color:#FFFFFF;

    cursor:pointer;
}

#esin_crypto_proof::file-selector-button:hover{
    background:#E42A2D;
}


/*==================================================
  UPLOAD STATUS
==================================================*/

#esin_crypto_upload_status{
    min-height:0;

    margin:7px 0 0;

    font-family:"Inter",sans-serif;
    font-size:12px;
    font-weight:600;
    line-height:1.4;
}

#esin_crypto_upload_status.uploading{
    color:#606872;
}

#esin_crypto_upload_status.success{
    color:#16834B;
}

#esin_crypto_upload_status.error{
    color:#E42A2D;
}


/*==================================================
  CRYPTO NOTICE
==================================================*/

.esin-crypto-notice{
    width:100%;

    margin:0;
    padding:12px 14px;

    background:#FFF5F5;

    border-left:3px solid #E42A2D;

    box-sizing:border-box;

    font-family:"Inter",sans-serif;
    font-size:12px;
    font-weight:400;
    line-height:1.55;

    color:#5E6670 !important;
}

.esin-crypto-notice strong{
    color:#101318 !important;
}


/*==================================================
  BANK SUMMARY
==================================================*/

.esin-bank-summary{
    width:100%;

    display:flex;
    align-items:flex-start;

    gap:12px;

    margin:0 0 14px;
    padding:15px;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-radius:4px;

    box-sizing:border-box;
}

.esin-bank-summary-icon{
    width:36px;
    height:36px;
    flex:0 0 36px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#101318;

    border-radius:50%;

    font-family:"Inter",sans-serif;
    font-size:15px;
    font-weight:700;

    color:#FFFFFF !important;
}

.esin-bank-summary > div:last-child{
    min-width:0;
}

.esin-bank-summary strong{
    display:block;

    margin:1px 0 3px;

    font-family:"Barlow Condensed",sans-serif;
    font-size:19px;
    font-weight:700;
    line-height:1.1;

    text-transform:uppercase;

    color:#101318 !important;
}

.esin-bank-summary p{
    margin:0 !important;

    font-family:"Inter",sans-serif;
    font-size:13px !important;
    font-weight:400;
    line-height:1.5;

    color:#606872 !important;
}


/*==================================================
  BANK NOTICE
==================================================*/

.esin-bank-notice{
    width:100%;

    margin:0;
    padding:14px;

    background:#FFFFFF;

    border-left:3px solid #E42A2D;

    box-sizing:border-box;
}

.esin-bank-notice strong{
    display:block;

    margin:0 0 4px;

    font-family:"Inter",sans-serif;
    font-size:12px;
    font-weight:700;

    color:#101318 !important;
}

.esin-bank-notice p{
    margin:0 !important;

    font-family:"Inter",sans-serif;
    font-size:13px !important;
    font-weight:400;
    line-height:1.55;

    color:#606872 !important;
}


/*==================================================
  PAYMENT ERROR
==================================================*/

.esin-payment-error{
    width:100%;

    padding:13px 14px;

    background:#FFF3F3;

    border:1px solid #F0CCCC;
    border-left:3px solid #E42A2D;

    box-sizing:border-box;

    font-family:"Inter",sans-serif;
    font-size:13px;
    font-weight:600;
    line-height:1.5;

    color:#A71D20 !important;
}


/*==================================================
  CRYPTO SAVINGS
==================================================*/

.woocommerce-checkout-review-order-table
.esin-you-save-row th,
.woocommerce-checkout-review-order-table
.esin-you-save-row td{
    color:#16834B !important;
    font-weight:700 !important;
}


/*==================================================
  REMOVE UNUSED PAYMENT METHODS
==================================================*/

.payment_method_esin_revolut,
.payment_method_esin_gift_card,
.payment_method_esin_paypal{
    display:none !important;
}


/*==================================================
  CHECKOUT TABLET
==================================================*/

@media(max-width:1024px){

    .esin-bank-panel,
    .esin-crypto-panel{
        padding:20px;
    }

    .esin-payment-intro h3{
        font-size:23px !important;
    }

}


/*==================================================
  CHECKOUT MOBILE
==================================================*/

@media(max-width:767px){

    .woocommerce-checkout
    .wc_payment_methods
    li.wc_payment_method
    > input[type="radio"]{
        margin-left:14px !important;
    }

    .woocommerce-checkout
    .wc_payment_methods
    li.wc_payment_method
    > label{
        min-height:54px;

        padding:13px 12px 13px 7px;

        font-size:14px;
    }


    .payment_method_esin_bank_instructions > label::before,
    .payment_method_esin_crypto > label::before{
        width:28px;
        height:28px;
        flex-basis:28px;

        margin-right:8px;
    }


    .esin-bank-panel,
    .esin-crypto-panel{
        padding:17px 14px;
    }


    .esin-payment-intro{
        margin-bottom:17px;
    }

    .esin-payment-intro h3{
        font-size:22px !important;
    }

    .esin-payment-description p{
        font-size:14px !important;
    }


    .esin-field-group{
        margin-bottom:16px;
    }

    .esin-field-group > label > span{
        font-size:13px;
    }

    .esin-field-group > label > small{
        font-size:11px;
    }


    .payment_method_esin_crypto #esin_crypto_coin,
    .payment_method_esin_crypto #esin-wallet-input,
    .payment_method_esin_crypto #esin-crypto-amount,
    .payment_method_esin_crypto #esin_crypto_txid{
        min-height:46px;

        padding:0 12px !important;

        font-size:14px !important;
    }


    .esin-wallet-row{
        grid-template-columns:minmax(0,1fr) 72px;
        gap:6px;
    }

    .esin-copy-btn{
        min-height:46px;

        padding:0 8px !important;

        font-size:12px !important;
    }


    .esin-qr-card{
        padding:15px;
    }


    .esin-bank-summary{
        padding:13px;
    }

    .esin-bank-summary strong{
        font-size:18px;
    }

    .esin-bank-summary p,
    .esin-bank-notice p{
        font-size:13px !important;
    }


    #esin_crypto_proof{
        font-size:12px;
    }

}


/*==================================================
  CHECKOUT SMALL MOBILE
==================================================*/

@media(max-width:480px){

    .woocommerce-checkout
    .wc_payment_methods
    li.wc_payment_method
    > label{
        font-size:13px;
    }


    .esin-bank-panel,
    .esin-crypto-panel{
        padding:15px 12px;
    }


    .esin-discount-box{
        padding:12px;
    }


    .esin-wallet-row{
        display:block;
    }

    .esin-copy-btn{
        width:100%;
        margin-top:7px !important;
    }


    .esin-payment-intro h3{
        font-size:21px !important;
    }

}


/*==================================================
  END CHECKOUT PAYMENT CSS
==================================================*/


/*==================================================
  TORQUELINE MOTORS
  ORDER RECEIVED / PAYMENT CONFIRMATION
==================================================*/

/*==================================================
  MAIN PAYMENT PANEL
==================================================*/

.tlm-order-payment-panel{
    width:100%;
    max-width:1280px;

    margin:0 auto;
    padding:64px 24px 70px;

    background:#F3F4F5;

    box-sizing:border-box;

    font-family:"Inter",sans-serif;
}

/*==================================================
  PAYMENT STATUS CARD
==================================================*/

.tlm-payment-status-card{
    position:relative;

    width:100%;

    display:flex;
    align-items:center;

    gap:22px;

    margin:0 0 28px;
    padding:28px 30px;

    background:#101318;

    border-left:4px solid #E42A2D;
    border-radius:4px;

    box-sizing:border-box;

    overflow:hidden;
}

.tlm-payment-status-card::after{
    content:"";

    position:absolute;

    width:180px;
    height:180px;

    right:-70px;
    top:-80px;

    border:1px solid rgba(255,255,255,.06);
    border-radius:50%;

    pointer-events:none;
}

/* STATUS ICON */

.tlm-payment-status-icon{
    width:54px;
    height:54px;

    flex:0 0 54px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#E42A2D;

    border-radius:50%;

    font-family:"Inter",sans-serif;

    font-size:22px;
    font-weight:700;

    line-height:1;

    color:#FFFFFF !important;
}

/* STATUS COPY */

.tlm-payment-status-copy{
    position:relative;
    z-index:2;

    min-width:0;
}

.tlm-payment-status-label{
    display:block;

    margin:0 0 6px;

    font-family:"Inter",sans-serif;

    font-size:11px;
    font-weight:800;

    line-height:1.2;

    letter-spacing:1.5px;

    color:#E42A2D !important;

    text-transform:uppercase;
}

.tlm-payment-status-copy h2{
    margin:0 0 7px !important;
    padding:0 !important;

    font-family:"Barlow Condensed",sans-serif !important;

    font-size:38px !important;
    font-weight:700 !important;

    line-height:1 !important;

    text-transform:uppercase;

    color:#FFFFFF !important;
}

.tlm-payment-status-copy p{
    max-width:800px;

    margin:0 !important;

    font-family:"Inter",sans-serif;

    font-size:15px !important;
    font-weight:400;

    line-height:1.6;

    color:#AEB5BD !important;
}

/*==================================================
  PAYMENT SUMMARY GRID
==================================================*/

.tlm-payment-summary-grid{
    width:100%;

    display:grid;

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

    gap:14px;

    margin:0 0 28px;
}

.tlm-payment-summary-item{
    position:relative;

    min-width:0;

    padding:20px 20px 21px;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-radius:4px;

    box-sizing:border-box;

    box-shadow:
        0 4px 16px rgba(16,19,24,.035);
}

.tlm-payment-summary-item::before{
    content:"";

    position:absolute;

    left:0;
    bottom:0;

    width:0;
    height:3px;

    background:#E42A2D;

    transition:width .25s ease;
}

.tlm-payment-summary-item:hover::before{
    width:100%;
}

.tlm-payment-summary-item span{
    display:block;

    margin:0 0 7px;

    font-family:"Inter",sans-serif;

    font-size:11px;
    font-weight:700;

    line-height:1.2;

    letter-spacing:1px;

    color:#818891 !important;

    text-transform:uppercase;
}

.tlm-payment-summary-item strong{
    display:block;

    margin:0;

    font-family:"Barlow Condensed",sans-serif;

    font-size:24px;
    font-weight:700;

    line-height:1.1;

    color:#101318 !important;

    text-transform:uppercase;

    overflow-wrap:anywhere;
}

/* TOTAL */

.tlm-payment-summary-item:nth-child(2)
strong{
    color:#E42A2D !important;
}

/*==================================================
  PAYMENT INSTRUCTIONS CARD
==================================================*/

.tlm-payment-instructions-card{
    width:100%;

    margin:0 0 28px;
    padding:30px;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-radius:4px;

    box-sizing:border-box;

    box-shadow:
        0 5px 20px rgba(16,19,24,.035);
}

/*==================================================
  INSTRUCTIONS HEADING
==================================================*/

.tlm-payment-instructions-heading{
    display:flex;

    align-items:flex-start;

    gap:17px;

    margin:0 0 22px;
}

.tlm-payment-instructions-number{
    width:42px;
    height:42px;

    flex:0 0 42px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#101318;

    border-radius:50%;

    font-family:"Barlow Condensed",sans-serif;

    font-size:19px;
    font-weight:700;

    line-height:1;

    color:#FFFFFF !important;
}

.tlm-payment-instructions-heading > div{
    min-width:0;
}

.tlm-payment-instructions-heading h3{
    margin:0 0 5px !important;
    padding:0 !important;

    font-family:"Barlow Condensed",sans-serif !important;

    font-size:30px !important;
    font-weight:700 !important;

    line-height:1.05 !important;

    text-transform:uppercase;

    color:#101318 !important;
}

.tlm-payment-instructions-heading p{
    margin:0 !important;

    font-family:"Inter",sans-serif;

    font-size:14px !important;
    font-weight:400;

    line-height:1.6;

    color:#606872 !important;
}

/*==================================================
  CUSTOM BANK INSTRUCTIONS
==================================================*/

.tlm-payment-custom-instructions{
    width:100%;

    margin:0 0 24px;
    padding:16px 18px;

    background:#F3F4F5;

    border-left:3px solid #E42A2D;

    box-sizing:border-box;
}

.tlm-payment-custom-instructions p{
    margin:0 !important;

    font-family:"Inter",sans-serif;

    font-size:14px !important;
    font-weight:400;

    line-height:1.65;

    color:#5E6670 !important;
}

.tlm-payment-custom-instructions strong{
    color:#101318 !important;
}

/*==================================================
  CRYPTO REVIEW DETAILS
==================================================*/

.tlm-crypto-review-details{
    width:100%;

    margin:0 0 25px;

    border:1px solid #E1E4E7;
    border-radius:4px;

    overflow:hidden;
}

.tlm-crypto-review-row{
    width:100%;

    display:grid;

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

    gap:20px;

    align-items:center;

    padding:14px 16px;

    background:#FFFFFF;

    border-bottom:1px solid #E8EAEC;

    box-sizing:border-box;
}

.tlm-crypto-review-row:last-child{
    border-bottom:none;
}

.tlm-crypto-review-row span{
    font-family:"Inter",sans-serif;

    font-size:12px;
    font-weight:600;

    line-height:1.4;

    color:#737A83 !important;
}

.tlm-crypto-review-row strong{
    font-family:"Inter",sans-serif;

    font-size:13px;
    font-weight:700;

    line-height:1.5;

    color:#101318 !important;
}

.tlm-crypto-review-row a{
    color:#E42A2D !important;

    text-decoration:none;

    font-weight:700;
}

.tlm-crypto-review-row a:hover{
    text-decoration:underline;
}

.tlm-break-word{
    overflow-wrap:anywhere;
    word-break:break-word;
}

/*==================================================
  PAYMENT CONTACT
==================================================*/

.tlm-payment-contact{
    width:100%;

    margin:25px 0 0;
    padding:25px;

    background:#F3F4F5;

    border:1px solid #E1E4E7;

    box-sizing:border-box;
}

/* CONTACT HEADING */

.tlm-payment-contact-heading{
    margin:0 0 18px;
}

.tlm-payment-contact-heading > span{
    display:block;

    margin:0 0 5px;

    font-family:"Inter",sans-serif;

    font-size:11px;
    font-weight:800;

    line-height:1.2;

    letter-spacing:1.3px;

    color:#E42A2D !important;

    text-transform:uppercase;
}

.tlm-payment-contact-heading h3{
    margin:0 0 5px !important;

    font-family:"Barlow Condensed",sans-serif !important;

    font-size:26px !important;
    font-weight:700 !important;

    line-height:1.05 !important;

    text-transform:uppercase;

    color:#101318 !important;
}

.tlm-payment-contact-heading p{
    margin:0 !important;

    font-family:"Inter",sans-serif;

    font-size:14px !important;

    line-height:1.55;

    color:#606872 !important;
}

/*==================================================
  CONTACT BUTTONS
==================================================*/

.tlm-payment-contact-buttons{
    width:100%;

    display:grid;

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

    gap:12px;
}

.tlm-contact-button{
    min-width:0;

    display:flex !important;

    align-items:center;

    gap:12px;

    min-height:70px;

    padding:13px 15px !important;

    background:#FFFFFF;

    border:1px solid #DDE1E4;
    border-radius:4px;

    box-sizing:border-box;

    text-decoration:none !important;

    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.tlm-contact-button:hover{
    transform:translateY(-2px);

    border-color:#101318;

    box-shadow:
        0 5px 16px rgba(16,19,24,.07);
}

/* ICON */

.tlm-contact-icon{
    width:40px;
    height:40px;

    flex:0 0 40px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#101318;

    border-radius:50%;

    font-family:"Inter",sans-serif;

    font-size:15px;
    font-weight:800;

    line-height:1;

    color:#FFFFFF !important;
}

.tlm-contact-whatsapp
.tlm-contact-icon{
    background:#16834B;
}

.tlm-contact-imessage
.tlm-contact-icon{
    background:#101318;
}

/* COPY */

.tlm-contact-copy{
    min-width:0;

    flex:1;
}

.tlm-contact-copy small{
    display:block;

    margin:0 0 2px;

    font-family:"Inter",sans-serif;

    font-size:11px;
    font-weight:500;

    line-height:1.2;

    color:#7A818A !important;
}

.tlm-contact-copy strong{
    display:block;

    font-family:"Inter",sans-serif;

    font-size:15px;
    font-weight:700;

    line-height:1.25;

    color:#101318 !important;
}

/* ARROW */

.tlm-contact-arrow{
    margin-left:auto;

    font-family:"Inter",sans-serif;

    font-size:17px;
    font-weight:600;

    color:#E42A2D !important;
}

/*==================================================
  ORDER TIMELINE
==================================================*/

.tlm-payment-timeline{
    position:relative;

    width:100%;

    display:grid;

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

    gap:0;

    margin:0 0 25px;
    padding:26px 24px;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-radius:4px;

    box-sizing:border-box;
}

/* LINE */

.tlm-payment-timeline::before{
    content:"";

    position:absolute;

    top:46px;
    left:12.5%;
    right:12.5%;

    height:2px;

    background:#E1E4E7;

    z-index:0;
}

/* STEP */

.tlm-payment-timeline-step{
    position:relative;
    z-index:1;

    min-width:0;

    padding:0 10px;

    text-align:center;
}

/* MARKER */

.tlm-timeline-marker{
    width:40px;
    height:40px;

    display:flex;

    align-items:center;
    justify-content:center;

    margin:0 auto 12px;

    background:#FFFFFF;

    border:2px solid #CDD2D7;
    border-radius:50%;

    font-family:"Inter",sans-serif;

    font-size:13px;
    font-weight:800;

    line-height:1;

    color:#7A818A !important;

    box-sizing:border-box;
}

.tlm-payment-timeline-step.is-complete
.tlm-timeline-marker{
    background:#101318;

    border-color:#101318;

    color:#FFFFFF !important;
}

.tlm-payment-timeline-step.is-current
.tlm-timeline-marker{
    background:#E42A2D;

    border-color:#E42A2D;

    color:#FFFFFF !important;
}

/* TIMELINE TEXT */

.tlm-payment-timeline-step strong{
    display:block;

    margin:0 0 4px;

    font-family:"Barlow Condensed",sans-serif;

    font-size:19px;
    font-weight:700;

    line-height:1.1;

    color:#101318 !important;

    text-transform:uppercase;
}

.tlm-payment-timeline-step small{
    display:block;

    max-width:190px;

    margin:0 auto;

    font-family:"Inter",sans-serif;

    font-size:12px;
    font-weight:400;

    line-height:1.5;

    color:#737A83 !important;
}

/*==================================================
  SECURITY / IMPORTANT NOTICE
==================================================*/

.tlm-payment-security-note{
    width:100%;

    margin:0;
    padding:17px 19px;

    background:#101318;

    border-left:4px solid #E42A2D;
    border-radius:3px;

    box-sizing:border-box;

    font-family:"Inter",sans-serif;

    font-size:14px;
    font-weight:400;

    line-height:1.6;

    color:#B7BDC5 !important;
}

.tlm-payment-security-note strong{
    color:#FFFFFF !important;
}

/*==================================================
  WOOCOMMERCE THANK YOU AREA
==================================================*/

.woocommerce-order{
    font-family:"Inter",sans-serif;

    color:#101318;
}

.woocommerce-order
.woocommerce-notice--success,
.woocommerce-order
.woocommerce-thankyou-order-received{
    margin:0 0 22px !important;

    padding:15px 18px !important;

    background:#FFFFFF;

    border:1px solid #E1E4E7;
    border-left:4px solid #E42A2D;

    font-family:"Inter",sans-serif;

    font-size:14px !important;
    font-weight:600;

    line-height:1.5;

    color:#101318 !important;
}

/*==================================================
  NATIVE TOP ORDER OVERVIEW
==================================================*/

.woocommerce-order
ul.woocommerce-order-overview{
    width:100%;

    display:grid;

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

    gap:0;

    margin:0 0 42px !important;
    padding:0 !important;

    background:#FFFFFF;

    border:1px solid #E1E4E7;

    list-style:none !important;

    box-sizing:border-box;
}

.woocommerce-order
ul.woocommerce-order-overview
li{
    min-width:0;

    margin:0 !important;
    padding:17px 18px !important;

    border-right:1px solid #E1E4E7;

    font-family:"Inter",sans-serif;

    font-size:11px !important;
    font-weight:600;

    line-height:1.4;

    letter-spacing:.4px;

    color:#7A818A !important;

    text-transform:uppercase;
}

.woocommerce-order
ul.woocommerce-order-overview
li:last-child{
    border-right:none;
}

.woocommerce-order
ul.woocommerce-order-overview
li strong{
    display:block;

    margin-top:6px;

    font-family:"Inter",sans-serif;

    font-size:14px !important;
    font-weight:700;

    line-height:1.4;

    letter-spacing:0;

    color:#101318 !important;

    text-transform:none;

    overflow-wrap:anywhere;
}

/*==================================================
  ORDER DETAILS SECTION
==================================================*/

.woocommerce-order
.woocommerce-order-details{
    width:100%;

    margin:45px 0 0 !important;
}

.woocommerce-order
.woocommerce-order-details
.woocommerce-order-details__title{
    margin:0 0 20px !important;

    font-family:"Barlow Condensed",sans-serif !important;

    font-size:36px !important;
    font-weight:700 !important;

    line-height:1 !important;

    color:#101318 !important;

    text-transform:uppercase;
}

/*==================================================
  ORDER DETAILS TABLE
==================================================*/

.woocommerce-order
table.woocommerce-table--order-details{
    width:100% !important;

    margin:0 !important;

    background:#FFFFFF;

    border:1px solid #E1E4E7 !important;
    border-collapse:separate !important;
    border-spacing:0 !important;

    border-radius:4px;

    overflow:hidden;
}

.woocommerce-order
table.woocommerce-table--order-details
th,
.woocommerce-order
table.woocommerce-table--order-details
td{
    padding:16px 18px !important;

    border:none !important;
    border-bottom:1px solid #E1E4E7 !important;

    font-family:"Inter",sans-serif;

    font-size:14px !important;

    line-height:1.5;

    color:#5E6670 !important;

    vertical-align:middle;
}

.woocommerce-order
table.woocommerce-table--order-details
thead th{
    background:#101318;

    font-size:12px !important;
    font-weight:700;

    letter-spacing:.6px;

    color:#FFFFFF !important;

    text-transform:uppercase;
}

.woocommerce-order
table.woocommerce-table--order-details
tbody td.product-name a{
    font-weight:700;

    color:#101318 !important;

    text-decoration:none;
}

.woocommerce-order
table.woocommerce-table--order-details
tbody td.product-name a:hover{
    color:#E42A2D !important;
}

.woocommerce-order
table.woocommerce-table--order-details
tfoot th{
    font-weight:700;

    color:#101318 !important;
}

.woocommerce-order
table.woocommerce-table--order-details
tfoot tr:last-child th,
.woocommerce-order
table.woocommerce-table--order-details
tfoot tr:last-child td{
    border-bottom:none !important;

    font-weight:800;

    color:#101318 !important;
}

/*==================================================
  HIDE UNWANTED VARIATION META
==================================================*/

.woocommerce-order
.wc-item-meta{
    display:none !important;
}

/*==================================================
  CUSTOMER DETAILS
==================================================*/

.woocommerce-order
.woocommerce-customer-details{
    width:100%;

    margin:45px 0 0 !important;
}

.woocommerce-order
.woocommerce-customer-details > h2,
.woocommerce-order
.woocommerce-column__title{
    margin:0 0 18px !important;

    font-family:"Barlow Condensed",sans-serif !important;

    font-size:31px !important;
    font-weight:700 !important;

    line-height:1 !important;

    color:#101318 !important;

    text-transform:uppercase;
}

/* ADDRESS COLUMNS */

.woocommerce-order
.woocommerce-columns--addresses{
    display:grid !important;

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

    gap:18px;

    margin:0 !important;
}

.woocommerce-order
.woocommerce-column--billing-address,
.woocommerce-order
.woocommerce-column--shipping-address{
    width:100% !important;

    float:none !important;

    margin:0 !important;
}

/* ADDRESS CARD */

.woocommerce-order
.woocommerce-customer-details
address{
    min-height:180px;

    margin:0 !important;
    padding:22px !important;

    background:#FFFFFF;

    border:1px solid #E1E4E7 !important;
    border-radius:4px !important;

    box-sizing:border-box;

    font-family:"Inter",sans-serif;

    font-size:14px !important;
    font-style:normal;

    line-height:1.75;

    color:#5E6670 !important;
}

.woocommerce-order
.woocommerce-customer-details
address p{
    margin:8px 0 0 !important;

    font-size:14px !important;

    color:#5E6670 !important;
}

/*==================================================
  TABLET
==================================================*/

@media(max-width:1024px){

    .tlm-order-payment-panel{
        padding:52px 22px 60px;
    }

    .tlm-payment-status-copy h2{
        font-size:34px !important;
    }

    .tlm-payment-summary-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .tlm-payment-timeline{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:28px 0;
    }

    .tlm-payment-timeline::before{
        display:none;
    }

    .woocommerce-order
    ul.woocommerce-order-overview{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

    .woocommerce-order
    ul.woocommerce-order-overview
    li{
        border-bottom:1px solid #E1E4E7;
    }

}

/*==================================================
  MOBILE
==================================================*/

@media(max-width:767px){

    .tlm-order-payment-panel{
        padding:38px 15px 45px;
    }

    /* STATUS */

    .tlm-payment-status-card{
        align-items:flex-start;

        gap:14px;

        margin-bottom:18px;

        padding:20px 17px;
    }

    .tlm-payment-status-icon{
        width:44px;
        height:44px;

        flex-basis:44px;

        font-size:18px;
    }

    .tlm-payment-status-label{
        font-size:10px;
    }

    .tlm-payment-status-copy h2{
        font-size:29px !important;
    }

    .tlm-payment-status-copy p{
        font-size:14px !important;
    }

    /* SUMMARY */

    .tlm-payment-summary-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:10px;

        margin-bottom:18px;
    }

    .tlm-payment-summary-item{
        padding:16px 14px 17px;
    }

    .tlm-payment-summary-item span{
        font-size:10px;
    }

    .tlm-payment-summary-item strong{
        font-size:21px;
    }

    /* INSTRUCTIONS */

    .tlm-payment-instructions-card{
        margin-bottom:18px;

        padding:20px 16px;
    }

    .tlm-payment-instructions-heading{
        gap:12px;

        margin-bottom:18px;
    }

    .tlm-payment-instructions-number{
        width:38px;
        height:38px;

        flex-basis:38px;

        font-size:17px;
    }

    .tlm-payment-instructions-heading h3{
        font-size:25px !important;
    }

    .tlm-payment-instructions-heading p{
        font-size:14px !important;
    }

    /* CUSTOM INSTRUCTIONS */

    .tlm-payment-custom-instructions{
        padding:14px;

        margin-bottom:18px;
    }

    /* CONTACT */

    .tlm-payment-contact{
        padding:18px 14px;
    }

    .tlm-payment-contact-heading h3{
        font-size:24px !important;
    }

    .tlm-payment-contact-buttons{
        grid-template-columns:1fr;
    }

    .tlm-contact-button{
        min-height:65px;
    }

    /* CRYPTO */

    .tlm-crypto-review-row{
        grid-template-columns:1fr;

        gap:4px;

        padding:13px 14px;
    }

    /* TIMELINE */

    .tlm-payment-timeline{
        grid-template-columns:1fr;

        gap:0;

        padding:18px 16px;
    }

    .tlm-payment-timeline-step{
        display:grid;

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

        gap:13px;

        padding:0 0 22px;

        text-align:left;
    }

    .tlm-payment-timeline-step:last-child{
        padding-bottom:0;
    }

    .tlm-payment-timeline-step::after{
        content:"";

        position:absolute;

        left:19px;
        top:40px;
        bottom:0;

        width:2px;

        background:#E1E4E7;

        z-index:0;
    }
    
    .tlm-payment-timeline-step > *{
    position:relative;
    z-index:1;
}

    .tlm-payment-timeline-step:last-child::after{
        display:none;
    }

    .tlm-timeline-marker{
        margin:0;
    }

    .tlm-payment-timeline-step strong{
        margin-top:3px;

        font-size:19px;

        text-align:left;
    }

    .tlm-payment-timeline-step small{
        max-width:none;

        margin:0;

        font-size:12px;

        text-align:left;
    }

    /* SECURITY */

    .tlm-payment-security-note{
        padding:15px;

        font-size:13px;
    }

    /* NATIVE ORDER OVERVIEW */

    .woocommerce-order
    ul.woocommerce-order-overview{
        grid-template-columns:1fr 1fr;

        margin-bottom:30px !important;
    }

    .woocommerce-order
    ul.woocommerce-order-overview
    li{
        padding:14px !important;

        border-right:1px solid #E1E4E7;
        border-bottom:1px solid #E1E4E7;
    }

    .woocommerce-order
    ul.woocommerce-order-overview
    li strong{
        font-size:13px !important;
    }

    /* ORDER DETAILS */

    .woocommerce-order
    .woocommerce-order-details{
        margin-top:35px !important;
    }

    .woocommerce-order
    .woocommerce-order-details
    .woocommerce-order-details__title{
        font-size:31px !important;
    }

    .woocommerce-order
    table.woocommerce-table--order-details
    th,
    .woocommerce-order
    table.woocommerce-table--order-details
    td{
        padding:13px 11px !important;

        font-size:13px !important;
    }

    /* CUSTOMER DETAILS */

    .woocommerce-order
    .woocommerce-columns--addresses{
        grid-template-columns:1fr;

        gap:25px;
    }

    .woocommerce-order
    .woocommerce-column__title{
        font-size:27px !important;
    }

    .woocommerce-order
    .woocommerce-customer-details
    address{
        min-height:0;

        padding:18px !important;

        font-size:14px !important;
    }

}

/*==================================================
  SMALL MOBILE
==================================================*/

@media(max-width:480px){

    .tlm-order-payment-panel{
        padding:32px 12px 40px;
    }

    .tlm-payment-status-card{
        display:block;

        padding:18px 15px;
    }

    .tlm-payment-status-icon{
        margin-bottom:13px;
    }

    .tlm-payment-status-copy h2{
        font-size:27px !important;
    }

    .tlm-payment-summary-grid{
        grid-template-columns:1fr;
    }

    .tlm-payment-summary-item{
        padding:15px;
    }

    .tlm-payment-instructions-heading{
        display:block;
    }

    .tlm-payment-instructions-number{
        margin-bottom:12px;
    }

    .tlm-payment-contact{
        margin-top:20px;
    }

    .woocommerce-order
    ul.woocommerce-order-overview{
        grid-template-columns:1fr;
    }

    .woocommerce-order
    ul.woocommerce-order-overview
    li{
        border-right:none;
    }

}




/*==================================================
  ORDER RECEIVED — FINAL POLISH
==================================================*/


/*==================================================
  KEEP YOUR ORDER NUMBER
==================================================*/

.tlm-received-summary .tlm-summary-notice strong,
.tlm-received-summary .tlm-order-notice strong,
.tlm-received-summary .tlm-keep-order-number strong{
    color:#FFFFFF !important;
}

/*
  Fallback:
  makes the heading inside the dark notice white
*/
.tlm-received-summary [class*="notice"] h3,
.tlm-received-summary [class*="notice"] h4,
.tlm-received-summary [class*="notice"] strong{
    color:#FFFFFF !important;
}


/*==================================================
  BILLING DETAILS
==================================================*/

.woocommerce-order
.woocommerce-customer-details{
    width:100%;
    margin:45px 0 0 !important;
}


/* BILLING TITLE */

.woocommerce-order
.woocommerce-customer-details > h2,
.woocommerce-order
.woocommerce-column__title{
    position:relative;

    margin:0 0 20px !important;
    padding:0 0 0 20px !important;

    font-family:"Barlow Condensed",sans-serif !important;

    font-size:34px !important;
    font-weight:700 !important;

    line-height:1 !important;

    color:#101318 !important;

    text-transform:uppercase;
}


/* RED TITLE ACCENT */

.woocommerce-order
.woocommerce-customer-details > h2::before,
.woocommerce-order
.woocommerce-column__title::before{
    content:"";

    position:absolute;

    left:0;
    top:3px;

    width:4px;
    height:28px;

    background:#E42A2D;
}


/*==================================================
  ADDRESS COLUMNS
==================================================*/

.woocommerce-order
.woocommerce-columns--addresses{
    display:grid !important;

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

    gap:18px;

    margin:0 !important;
}

.woocommerce-order
.woocommerce-column--billing-address,
.woocommerce-order
.woocommerce-column--shipping-address{
    width:100% !important;

    float:none !important;

    margin:0 !important;
}


/*==================================================
  ADDRESS CARD — COMPACT
==================================================*/

.woocommerce-order
.woocommerce-customer-details
address{
    position:relative;

    min-height:0 !important;
    height:auto !important;

    margin:0 !important;

    padding:26px 28px !important;

    background:#FFFFFF;

    border:1px solid #E1E4E7 !important;
    border-radius:5px !important;

    box-sizing:border-box;

    box-shadow:
        0 4px 18px rgba(16,19,24,.035);

    font-family:"Inter",sans-serif;

    font-size:15px !important;
    font-style:normal;

    line-height:1.7;

    color:#5E6670 !important;
}


/* SMALL RED TOP ACCENT */

.woocommerce-order
.woocommerce-customer-details
address::before{
    content:"";

    position:absolute;

    top:-1px;
    left:-1px;

    width:75px;
    height:3px;

    background:#E42A2D;
}


/*==================================================
  PHONE + EMAIL
==================================================*/

.woocommerce-order
.woocommerce-customer-details
address p{
    position:relative;

    margin:12px 0 0 !important;

    padding-left:32px;

    font-family:"Inter",sans-serif;

    font-size:14px !important;
    font-weight:500;

    line-height:1.55;

    color:#5E6670 !important;
}


/* PHONE ICON */

.woocommerce-order
.woocommerce-customer-details
.woocommerce-customer-details--phone::before{
    content:"☎";

    position:absolute;

    left:0;
    top:50%;

    width:23px;
    height:23px;

    display:flex;
    align-items:center;
    justify-content:center;

    transform:translateY(-50%);

    background:#F3F4F5;

    border-radius:50%;

    font-size:11px;

    color:#101318;
}


/* EMAIL ICON */

.woocommerce-order
.woocommerce-customer-details
.woocommerce-customer-details--email::before{
    content:"✉";

    position:absolute;

    left:0;
    top:50%;

    width:23px;
    height:23px;

    display:flex;
    align-items:center;
    justify-content:center;

    transform:translateY(-50%);

    background:#F3F4F5;

    border-radius:50%;

    font-size:11px;

    color:#101318;
}


/*==================================================
  MOBILE
==================================================*/

@media(max-width:767px){

    .woocommerce-order
    .woocommerce-customer-details{
        margin-top:35px !important;
    }

    .woocommerce-order
    .woocommerce-customer-details > h2,
    .woocommerce-order
    .woocommerce-column__title{
        padding-left:16px !important;

        font-size:28px !important;
    }

    .woocommerce-order
    .woocommerce-customer-details > h2::before,
    .woocommerce-order
    .woocommerce-column__title::before{
        width:3px;
        height:24px;
    }

    .woocommerce-order
    .woocommerce-columns--addresses{
        grid-template-columns:1fr;
    }

    .woocommerce-order
    .woocommerce-customer-details
    address{
        padding:20px !important;

        font-size:14px !important;
    }

}