/* PepTools Royal Mail Tracking + Order Journey */

.pt-order-journey{
    position:relative;
    overflow:hidden;
    margin:0 0 30px;
    padding:26px;
    border:1px solid rgba(32,166,255,.22);
    border-radius:18px;
    background:
      radial-gradient(circle at 88% 2%,rgba(0,153,255,.16),transparent 30%),
      linear-gradient(145deg,#050a10 0%,#07131f 55%,#050c13 100%);
    box-shadow:0 20px 55px rgba(0,0,0,.22);
    color:#d9e8f5;
}

.pt-order-journey:before{
    content:"";
    position:absolute;
    inset:auto -20% -45% 30%;
    height:240px;
    background:radial-gradient(ellipse,rgba(0,138,255,.13),transparent 68%);
    pointer-events:none;
}

.pt-order-journey__top{
    position:relative;
    z-index:1;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:22px;
    margin-bottom:26px;
}

.pt-order-journey__eyebrow,
.pt-rm-tracking__eyebrow{
    margin-bottom:7px;
    color:#49bdff;
    font-size:11px;
    line-height:1.2;
    font-weight:850;
    letter-spacing:.14em;
}

.pt-order-journey__top h2{
    margin:0 0 6px!important;
    color:#fff!important;
    font-size:26px!important;
    line-height:1.18!important;
    letter-spacing:-.025em;
}

.pt-order-journey__top p{
    margin:0;
    color:#8299aa;
    font-size:13px;
}

.pt-order-journey__status-badge{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    min-height:31px;
    padding:6px 11px;
    border:1px solid rgba(69,185,255,.25);
    border-radius:999px;
    background:rgba(0,137,255,.08);
    color:#8bd6ff;
    font-size:11px;
    font-weight:800;
    letter-spacing:.03em;
}

.pt-order-timeline{
    position:relative;
    z-index:1;
    margin:0!important;
    padding:0!important;
    list-style:none!important;
}

.pt-order-timeline__step{
    position:relative;
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:14px;
    margin:0!important;
    padding:0 0 22px!important;
    list-style:none!important;
}

.pt-order-timeline__step:last-child{
    padding-bottom:4px!important;
}

.pt-order-timeline__step:not(:last-child):before{
    content:"";
    position:absolute;
    left:16px;
    top:31px;
    bottom:0;
    width:2px;
    background:rgba(107,145,170,.17);
}

.pt-order-timeline__step.is-complete:not(:last-child):before{
    background:linear-gradient(180deg,#1798ff,rgba(23,152,255,.32));
}

.pt-order-timeline__marker{
    position:relative;
    z-index:2;
    width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    border:1px solid rgba(100,144,173,.22);
    background:#09131d;
    color:#5d7587;
    box-shadow:0 0 0 5px rgba(5,13,20,.78);
}

.pt-order-timeline__marker svg{
    width:17px;
    height:17px;
    fill:none;
    stroke:currentColor;
    stroke-width:2.25;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.pt-order-timeline__marker span{
    width:7px;
    height:7px;
    border-radius:50%;
    background:currentColor;
}

.pt-order-timeline__step.is-complete .pt-order-timeline__marker{
    border-color:rgba(45,181,255,.55);
    background:linear-gradient(180deg,#168fff,#0878e9);
    color:#fff;
    box-shadow:
      0 0 0 5px rgba(5,13,20,.78),
      0 0 22px rgba(0,137,255,.15);
}

.pt-order-timeline__step.is-current .pt-order-timeline__marker{
    border-color:#32baff;
    color:#67caff;
    background:#08243a;
    box-shadow:
      0 0 0 5px rgba(5,13,20,.78),
      0 0 0 4px rgba(0,151,255,.08),
      0 0 26px rgba(0,151,255,.17);
}

.pt-order-timeline__step.is-current .pt-order-timeline__marker span{
    box-shadow:0 0 0 6px rgba(65,193,255,.10);
}

.pt-order-timeline__content{
    min-width:0;
    padding-top:5px;
}

.pt-order-timeline__heading{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:16px;
    margin-bottom:4px;
}

.pt-order-timeline__heading strong{
    color:#f2f9ff;
    font-size:14px;
    line-height:1.35;
}

.pt-order-timeline__heading time{
    flex:0 0 auto;
    color:#678092;
    font-size:10px;
    line-height:1.35;
}

.pt-order-timeline__content p{
    margin:0!important;
    color:#71899a;
    font-size:12px;
    line-height:1.5;
}

.pt-order-timeline__step.is-upcoming .pt-order-timeline__heading strong{
    color:#627b8d;
}

.pt-order-timeline__step.is-upcoming .pt-order-timeline__content p{
    color:#536979;
}

.pt-order-timeline__step.is-current .pt-order-timeline__heading strong{
    color:#79d1ff;
}

.pt-rm-tracking{
    position:relative;
    z-index:1;
    overflow:hidden;
    margin:24px 0 0;
    padding:19px 20px;
    border:1px solid rgba(32,166,255,.30);
    border-radius:13px;
    background:
      radial-gradient(circle at 84% 15%,rgba(0,153,255,.16),transparent 40%),
      rgba(4,19,31,.86);
    color:#d9e8f5;
}

.pt-rm-tracking--journey{
    margin-top:24px;
}

.pt-rm-tracking__row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
}

.pt-rm-tracking h3{
    margin:0 0 12px!important;
    color:#fff!important;
    font-size:16px!important;
    line-height:1.3!important;
}

.pt-rm-tracking__number{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:7px 14px;
    margin:0;
}

.pt-rm-tracking__number span{
    color:#839caf;
    font-size:11px;
}

.pt-rm-tracking__number strong{
    color:#fff;
    font-size:15px;
    line-height:1.3;
    letter-spacing:.04em;
}

.woocommerce .pt-rm-tracking__button,
.pt-rm-tracking__button{
    flex:0 0 auto;
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:43px;
    padding:10px 15px!important;
    border:1px solid #168fff!important;
    border-radius:9px!important;
    background:linear-gradient(180deg,#1598ff,#0879e9)!important;
    color:#fff!important;
    box-shadow:0 7px 24px rgba(0,124,255,.18);
    font-size:12px!important;
    font-weight:800!important;
    line-height:1!important;
    text-decoration:none!important;
}

.pt-rm-tracking__button svg{
    width:15px;
    height:15px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.woocommerce .pt-rm-tracking__button:hover,
.pt-rm-tracking__button:hover{
    background:linear-gradient(180deg,#25a6ff,#0783f4)!important;
    color:#fff!important;
}

.pt-rm-tracking__hint{
    margin:12px 0 0!important;
    color:#607b8e;
    font-size:10px;
    line-height:1.5;
}

.pt-order-journey--exception{
    border-color:rgba(255,116,130,.22);
    background:linear-gradient(145deg,#10080b,#130b10);
}

.pt-order-journey--exception .pt-order-journey__eyebrow{
    color:#ff8291;
}

.pt-order-journey--exception .pt-order-journey__status-badge{
    border-color:rgba(255,116,130,.24);
    background:rgba(255,82,105,.07);
    color:#ff9ba7;
}

.pt-order-journey__exception-copy{
    position:relative;
    z-index:1;
    margin:0!important;
    color:#a68a90;
    font-size:13px;
    line-height:1.6;
}

@media (max-width:650px){
    .pt-order-journey{
        padding:21px 18px;
        border-radius:15px;
    }

    .pt-order-journey__top{
        align-items:flex-start;
        margin-bottom:23px;
    }

    .pt-order-journey__top h2{
        font-size:22px!important;
    }

    .pt-order-journey__status-badge{
        min-height:28px;
        padding:5px 9px;
        font-size:10px;
    }

    .pt-order-timeline__step{
        grid-template-columns:31px minmax(0,1fr);
        gap:12px;
        padding-bottom:20px!important;
    }

    .pt-order-timeline__marker{
        width:31px;
        height:31px;
    }

    .pt-order-timeline__step:not(:last-child):before{
        left:15px;
        top:29px;
    }

    .pt-order-timeline__heading{
        display:block;
    }

    .pt-order-timeline__heading time{
        display:block;
        margin-top:2px;
    }

    .pt-rm-tracking__row{
        display:block;
    }

    .pt-rm-tracking__number{
        margin-bottom:15px;
        align-items:flex-start;
        flex-direction:column;
    }

    .woocommerce .pt-rm-tracking__button,
    .pt-rm-tracking__button{
        width:100%;
        box-sizing:border-box;
    }
}