/* ShipTimer premium UI */
.shiptimer-wrap{--st-scale:1;
  --st-accent:#5b43ea;
  --st-accent-soft:rgba(91,67,234,.12);
  --st-bg:#ffffff;
  --st-border:rgba(0,0,0,.10);
  --st-soft:rgba(0,0,0,.04);
  border:1px solid var(--st-border);
  border-radius:calc(16px * var(--st-scale));
  padding:calc(18px * var(--st-scale)) calc(18px * var(--st-scale)) calc(16px * var(--st-scale));
  background:var(--st-bg);
  box-shadow:0 8px 20px rgba(0,0,0,.06);
}

.shiptimer-head{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:calc(10px * var(--st-scale));
  margin-bottom:6px;
  font-weight:800;
  font-size:calc(18px * var(--st-scale));
  color:#1f144d;
}

.shiptimer-icon{
  width:calc(36px * var(--st-scale));height:calc(36px * var(--st-scale));border-radius:calc(12px * var(--st-scale));
  display:flex;align-items:center;justify-content:center;
  background:var(--st-accent-soft);
}

.shiptimer-sub{
  text-align:center;
  font-size:13px;
  color:rgba(31,20,77,.70);
  margin-bottom:calc(14px * var(--st-scale));
}

.shiptimer-grid{
  display:flex;
  justify-content:center;
  gap:calc(10px * var(--st-scale));
  flex-wrap:wrap;
}

.shiptimer-cell{
  min-width:calc(86px * var(--st-scale));
  padding:calc(12px * var(--st-scale)) calc(12px * var(--st-scale));
  border-radius:calc(14px * var(--st-scale));
  background:var(--st-soft);
  text-align:center;
  border:1px solid rgba(0,0,0,.05);
}

.shiptimer-num{
  font-size:calc(24px * var(--st-scale));
  font-weight:900;
  line-height:1.05;
  letter-spacing:.5px;
  color:#1f144d;
  transition:transform .18s ease, opacity .18s ease;
}

.shiptimer-num.shiptimer-pop{
  transform:scale(1.08);
}

.shiptimer-lbl{
  font-size:12px;
  opacity:.7;
  margin-top:calc(6px * var(--st-scale));
  color:#1f144d;
}

@media (max-width: 420px){
  .shiptimer-wrap{--st-scale:1;padding:16px 14px}
  .shiptimer-cell{min-width:74px;padding:10px 10px}
  .shiptimer-num{font-size:21px}
}

.shiptimer-compact .shiptimer-lbl{display:none;}
.shiptimer-compact .shiptimer-cell{min-width:70px;padding:10px 10px;border-radius:calc(14px * var(--st-scale));}
.shiptimer-compact .shiptimer-num{font-size:22px;}
.shiptimer-wrap .shiptimer-icon{background:rgba(91,67,234,.12);}
/* size variants */
.shiptimer-size-sm{padding:14px 14px 12px;border-radius:calc(14px * var(--st-scale));}
.shiptimer-size-sm .shiptimer-head{font-size:16px;}
.shiptimer-size-sm .shiptimer-icon{width:32px;height:32px;border-radius:10px;}
.shiptimer-size-sm .shiptimer-sub{font-size:12px;margin-bottom:10px;}
.shiptimer-size-sm .shiptimer-cell{min-width:74px;padding:10px 10px;border-radius:12px;}
.shiptimer-size-sm .shiptimer-num{font-size:20px;}
.shiptimer-size-sm.shiptimer-compact .shiptimer-cell{min-width:64px;}

.shiptimer-size-lg{padding:22px 22px 18px;border-radius:18px;}
.shiptimer-size-lg .shiptimer-head{font-size:20px;}
.shiptimer-size-lg .shiptimer-icon{width:40px;height:40px;border-radius:calc(14px * var(--st-scale));}
.shiptimer-size-lg .shiptimer-sub{font-size:14px;margin-bottom:16px;}
.shiptimer-size-lg .shiptimer-cell{min-width:96px;padding:14px 14px;border-radius:calc(16px * var(--st-scale));}
.shiptimer-size-lg .shiptimer-num{font-size:28px;}
.shiptimer-size-lg.shiptimer-compact .shiptimer-cell{min-width:80px;}

/* stretch mode */
.shiptimer-stretch{padding:calc(14px * var(--st-scale)) calc(14px * var(--st-scale)) calc(12px * var(--st-scale));}
.shiptimer-stretch .shiptimer-head{justify-content:flex-start;}
.shiptimer-stretch .shiptimer-sub{text-align:left;}
.shiptimer-stretch .shiptimer-grid{justify-content:flex-start;}

/* desktop layout fix: use left/right columns to avoid huge empty sides */
.shiptimer-inner{width:100%;}
@media (min-width: 768px){
  /* default desktop (center) */
  .shiptimer-desktop-center .shiptimer-head{justify-content:center;}
  .shiptimer-desktop-center .shiptimer-sub{text-align:center;}
  .shiptimer-desktop-center .shiptimer-grid{justify-content:center;}

  /* split desktop (wide) */
  .shiptimer-desktop-split .shiptimer-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:calc(18px * var(--st-scale));
  }
  .shiptimer-desktop-split .shiptimer-left{min-width:260px;}
  .shiptimer-desktop-split .shiptimer-right{display:flex; align-items:center; justify-content:flex-end; flex:1;}
  .shiptimer-desktop-split .shiptimer-head{justify-content:flex-start;}
  .shiptimer-desktop-split .shiptimer-sub{text-align:left;}
  .shiptimer-desktop-split .shiptimer-grid{justify-content:flex-end;}
}
@media (max-width: 767px){
  .shiptimer-inner{display:block;}
  .shiptimer-right{margin-top:12px;}
}

@media (min-width: 768px){
  /* fill desktop (dense tiles) */
  .shiptimer-desktop-fill .shiptimer-head{justify-content:flex-start;}
  .shiptimer-desktop-fill .shiptimer-sub{text-align:left;}
  .shiptimer-desktop-fill .shiptimer-grid{
    justify-content:space-between;
    width:100%;
  }
  .shiptimer-desktop-fill .shiptimer-cell{
    flex:1 1 0;
    min-width:0;
  }
}

@media (min-width: 768px){
  /* banner desktop: strong, edge-to-edge feel inside container */
  .shiptimer-desktop-banner{
    border: none;
    box-shadow: 0 10px 30px rgba(0,0,0,.06);
    background: linear-gradient(90deg, rgba(91,67,234,.10), rgba(91,67,234,.04));
  }
  .shiptimer-desktop-banner .shiptimer-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:calc(18px * var(--st-scale));
  }
  .shiptimer-desktop-banner .shiptimer-left{min-width:320px;}
  .shiptimer-desktop-banner .shiptimer-right{display:flex; flex:1; justify-content:flex-end; align-items:center;}
  .shiptimer-desktop-banner .shiptimer-head{justify-content:flex-start;}
  .shiptimer-desktop-banner .shiptimer-sub{text-align:left; opacity:.9;}
  .shiptimer-desktop-banner .shiptimer-grid{justify-content:flex-end;}
  .shiptimer-desktop-banner .shiptimer-cell{
    background: rgba(255,255,255,.75);
    border: 1px solid rgba(91,67,234,.10);
  }

  /* inline desktop: compact single row, no big paddings */
  .shiptimer-desktop-inline{padding:calc(12px * var(--st-scale)) calc(14px * var(--st-scale));}
  .shiptimer-desktop-inline .shiptimer-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:calc(14px * var(--st-scale));
  }
  .shiptimer-desktop-inline .shiptimer-left{display:flex; align-items:center; gap:calc(12px * var(--st-scale)); min-width:0;}
  .shiptimer-desktop-inline .shiptimer-sub{margin:0; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:520px;}
  .shiptimer-desktop-inline .shiptimer-right{display:flex; align-items:center; justify-content:flex-end; flex:1;}
  .shiptimer-desktop-inline .shiptimer-grid{justify-content:flex-end; gap:calc(10px * var(--st-scale));}
  .shiptimer-desktop-inline .shiptimer-cell{min-width:calc(78px * var(--st-scale)); padding:calc(10px * var(--st-scale)) calc(10px * var(--st-scale));}
}

/* make fill mode more obvious */
@media (min-width: 768px){
  .shiptimer-desktop-fill .shiptimer-grid{
    justify-content:space-between;
    width:100%;
    gap:calc(14px * var(--st-scale));
  }
  .shiptimer-desktop-fill .shiptimer-cell{
    flex:1 1 0;
    min-width:0;
    padding:calc(14px * var(--st-scale)) calc(14px * var(--st-scale));
  }
  .shiptimer-desktop-fill .shiptimer-num{font-size:calc(28px * var(--st-scale));}
  .shiptimer-desktop-fill .shiptimer-lbl{font-size:calc(12px * var(--st-scale));}
}