/* CODSHIPX R118-R7 PREMIUM BUSINESS ADD-ONS */

.r7-addons-page .cx-addon-grid{
  width:min(100%,1040px) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:26px !important;
  align-items:stretch !important;
}

.r7-addons-page .cx-addon-whatsapp,
.r7-addons-page [class*="whatsapp" i]{
  display:none !important;
}

.r7-addons-page
.cx-addon-grid > article.cx-addon-card:nth-of-type(n+3){
  display:none !important;
}

.r7-addons-page
.cx-addon-grid > article.cx-addon-card{
  --accent:#9de31f;

  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;

  display:flex !important;
  flex-direction:column !important;

  min-height:590px !important;
  padding:30px !important;

  border-radius:26px !important;
  border:1px solid rgba(255,255,255,.11) !important;

  color:#ffffff !important;

  box-shadow:
    0 26px 58px rgba(7,15,29,.20),
    0 8px 22px rgba(7,15,29,.10) !important;

  transition:
    transform .24s ease,
    box-shadow .24s ease,
    border-color .24s ease !important;
}

/* Codi */
.r7-addons-page
.cx-addon-grid > article.cx-addon-card:nth-of-type(1){
  --accent:#9de31f;
  background:#05070a !important;
  border-color:rgba(157,227,31,.24) !important;
}

/* Codi Voice */
.r7-addons-page
.cx-addon-grid > article.cx-addon-card:nth-of-type(2){
  --accent:#87b8ff;
  background:#093f9d !important;
  border-color:rgba(255,255,255,.18) !important;
}

/* premium solid decoration */
.r7-addons-page
.cx-addon-grid > article.cx-addon-card::before{
  content:"" !important;
  position:absolute !important;
  width:230px !important;
  height:230px !important;
  right:-110px !important;
  top:-105px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.045) !important;
  pointer-events:none !important;
}

.r7-addons-page
.cx-addon-grid > article.cx-addon-card::after{
  content:"" !important;
  position:absolute !important;
  left:30px !important;
  right:30px !important;
  top:0 !important;
  height:3px !important;
  border-radius:0 0 4px 4px !important;
  background:var(--accent) !important;
  opacity:.95 !important;
}

.r7-addons-page
.cx-addon-grid > article.cx-addon-card:hover{
  transform:translateY(-6px) !important;
  box-shadow:
    0 34px 76px rgba(7,15,29,.27),
    0 12px 28px rgba(7,15,29,.14) !important;
}

.r7-addons-page .cx-addon-card > *{
  position:relative !important;
  z-index:2 !important;
}

/* Typography */

.r7-addons-page .cx-addon-card,
.r7-addons-page .cx-addon-card h1,
.r7-addons-page .cx-addon-card h2,
.r7-addons-page .cx-addon-card h3,
.r7-addons-page .cx-addon-card strong,
.r7-addons-page .cx-addon-card span,
.r7-addons-page .cx-addon-card b{
  color:#ffffff !important;
}

.r7-addons-page .cx-addon-card h2{
  margin:15px 0 8px !important;
  font-size:35px !important;
  line-height:1 !important;
  letter-spacing:-.055em !important;
  font-weight:900 !important;
}

.r7-addons-page .cx-addon-card p{
  color:rgba(255,255,255,.73) !important;
  line-height:1.55 !important;
}

/* Product icon */

.r7-addons-page .commerce-icon{
  width:66px !important;
  height:66px !important;
  min-width:66px !important;

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

  border-radius:20px !important;

  background:rgba(255,255,255,.075) !important;
  border:1px solid rgba(255,255,255,.13) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 8px 22px rgba(0,0,0,.14) !important;
}

/* Codi real brand icon */

.r7-addons-page
.cx-addon-grid > article.cx-addon-card:nth-of-type(1)
.commerce-icon > *{
  opacity:0 !important;
}

.r7-addons-page
.cx-addon-grid > article.cx-addon-card:nth-of-type(1)
.commerce-icon::before{
  content:"" !important;
  width:44px !important;
  height:44px !important;
  border-radius:13px !important;

  background:
    url("/brand/codshipx-ai-icon.jpeg")
    center/cover no-repeat !important;

  box-shadow:
    0 5px 16px rgba(0,0,0,.28) !important;
}

/* product label badge */

.r7-addons-page
.cx-addon-card > span:not(.commerce-icon){
  padding:7px 12px !important;
  border-radius:999px !important;

  background:rgba(255,255,255,.09) !important;
  border:1px solid rgba(255,255,255,.12) !important;

  color:rgba(255,255,255,.86) !important;

  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.07em !important;
}

/* Features */

.r7-addons-page .cx-addon-feature-list{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:11px !important;
  margin:22px 0 !important;
}

.r7-addons-page
.cx-addon-feature-list > span{
  min-height:62px !important;

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

  gap:11px !important;

  padding:13px 14px !important;

  border-radius:14px !important;

  background:rgba(255,255,255,.065) !important;
  border:1px solid rgba(255,255,255,.10) !important;

  color:#ffffff !important;

  font-size:11px !important;
  font-weight:750 !important;
  line-height:1.3 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035) !important;

  transition:
    transform .17s ease,
    background .17s ease !important;
}

.r7-addons-page
.cx-addon-feature-list > span:hover{
  transform:translateY(-2px) !important;
  background:rgba(255,255,255,.10) !important;
}

.r7-addons-page
.cx-addon-feature-list > span i{
  width:27px !important;
  height:27px !important;
  min-width:27px !important;

  display:grid !important;
  place-items:center !important;

  border-radius:8px !important;

  background:rgba(255,255,255,.11) !important;
  color:#ffffff !important;
}

/* Status / price business panels */

.r7-addons-page .v1b4-addon-price,
.r7-addons-page .v1b1-addon-status{
  margin-top:12px !important;

  padding:17px 18px !important;

  border-radius:16px !important;

  background:rgba(255,255,255,.055) !important;
  border:1px solid rgba(255,255,255,.10) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03) !important;
}

.r7-addons-page .v1b4-addon-price strong{
  display:block !important;
  color:#ffffff !important;

  font-size:21px !important;
  font-weight:900 !important;
  letter-spacing:-.025em !important;
}

.r7-addons-page .v1b4-addon-price small,
.r7-addons-page .v1b1-addon-status small{
  color:rgba(255,255,255,.58) !important;
}

/* Active indicator */

.r7-addons-page
.v1b1-addon-status .active{
  color:#ffffff !important;
  font-weight:900 !important;
}

.r7-addons-page
.v1b1-addon-status .active::before{
  background:var(--accent) !important;
  box-shadow:
    0 0 0 5px rgba(255,255,255,.055),
    0 0 14px var(--accent) !important;
}

/* Buttons */

.r7-addons-page .cx-addon-card .button{
  min-height:54px !important;
  margin-top:auto !important;

  border-radius:14px !important;

  font-size:13px !important;
  font-weight:900 !important;

  transition:
    transform .17s ease,
    box-shadow .17s ease !important;
}

/* Codi button */

.r7-addons-page
.cx-addon-grid > article.cx-addon-card:nth-of-type(1)
.button.primary{
  background:#9de31f !important;
  border:1px solid #9de31f !important;
  color:#05070a !important;

  box-shadow:
    0 12px 28px rgba(157,227,31,.16) !important;
}

/* Voice purchase/open button */

.r7-addons-page
.cx-addon-grid > article.cx-addon-card:nth-of-type(2)
.button.primary{
  background:#ffffff !important;
  border:1px solid #ffffff !important;
  color:#093f9d !important;

  box-shadow:
    0 12px 28px rgba(0,0,0,.13) !important;
}

.r7-addons-page .cx-addon-card .button.primary:hover{
  transform:translateY(-2px) !important;
}

/* disabled */

.r7-addons-page .cx-addon-card .button.soft,
.r7-addons-page .cx-addon-card .button:disabled{
  background:rgba(255,255,255,.075) !important;
  border:1px solid rgba(255,255,255,.11) !important;
  color:rgba(255,255,255,.62) !important;
  opacity:1 !important;
  box-shadow:none !important;
}

/* Responsive */

@media(max-width:950px){
  .r7-addons-page .cx-addon-grid{
    grid-template-columns:1fr !important;
  }

  .r7-addons-page
  .cx-addon-grid > article.cx-addon-card{
    min-height:0 !important;
  }
}

@media(max-width:620px){
  .r7-addons-page
  .cx-addon-grid > article.cx-addon-card{
    padding:21px !important;
    border-radius:22px !important;
  }

  .r7-addons-page .cx-addon-feature-list{
    grid-template-columns:1fr !important;
  }

  .r7-addons-page .cx-addon-card h2{
    font-size:30px !important;
  }
}

/* no gradients / no observers / CSS only */
/* END R118-R7 */
