/* Scoped to the actual cart-page page root: no leakage into header/footer or other routes. */
/* Approved design styles extracted from checkout/fallback_cart_page.html; loaded on matching route only. */

    .cart-page{
      --teal: #173f49;
      --teal-2: #245864;
      --teal-soft: rgba(23, 63, 73, .66);
      --pink: #ff6b7a;
      --pink-dark: #f35668;
      --pink-soft: #fff3f5;
      --white: #fff;
      --soft: #f7f6f2;
      --soft-2: #fbfaf7;
      --line: rgba(23, 63, 73, .11);
      --line-strong: rgba(23, 63, 73, .18);
      --success: #2f8a68;
      --danger: #c94a59;
      --shadow: 0 18px 48px -34px rgba(23, 63, 73, .42);
      --container: 1240px;
      --gutter: clamp(14px, 3vw, 36px);
    }

    .cart-page *{ box-sizing: border-box; }

    .cart-page{
      background: #fff;
      scroll-behavior: smooth;
    }

    .cart-page{
      margin: 0;
      font-family: IRANSansFaNum,Tahoma, Arial, sans-serif;
      color: var(--teal);
      background:
        radial-gradient(circle at 8% 8%, rgba(255,107,122,.05), transparent 24rem),
        linear-gradient(180deg, #fff 0, #fff 54%, #fbfaf7 100%);
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }

    .cart-page button, .cart-page input{
      font: inherit;
    }

    .cart-page img{
      display: block;
      max-width: 100%;
    }

    .cart-page a{
      color: inherit;
    }

    .cart-page{
      min-height: 100vh;
      direction: rtl;
      text-align: right;
    }

    .cart-page .container{
      width: min(100%, var(--container));
      margin-inline: auto;
      padding-inline: var(--gutter);
    }

    /* ===== TOP ===== */
    .cart-page .cart-top{
      padding: 24px 0 22px;
      border-bottom: 1px solid var(--line);
      background: rgba(255,255,255,.86);
    }

    .cart-page .breadcrumb{
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 7px;
      margin: 0 0 15px;
      color: var(--teal-soft);
      font-size: .73rem;
      line-height: 1.6;
    }

    .cart-page .breadcrumb a{
      text-decoration: none;
    }

    .cart-page .breadcrumb a:hover, .cart-page .breadcrumb a:focus-visible{
      color: var(--teal);
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    .cart-page .breadcrumb-sep{
      opacity: .42;
    }

    .cart-page .cart-title{
      margin: 0;
      font-size: clamp(1.65rem, 2.5vw, 2.2rem);
      font-weight: 900;
      line-height: 1.35;
      letter-spacing: -.02em;
    }

    .cart-page .cart-lead{
      max-width: 64ch;
      margin: 8px 0 0;
      color: var(--teal-soft);
      font-size: .86rem;
      line-height: 1.9;
    }

    .cart-page .assurances{
      margin-top: 13px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .cart-page .assurances span{
      min-height: 34px;
      padding: 7px 10px;
      display: inline-flex;
      align-items: center;
      gap: 6px;
      border: 1px solid rgba(23,63,73,.09);
      border-radius: 999px;
      background: #fff;
      color: var(--teal-soft);
      font-size: .66rem;
      font-weight: 800;
      line-height: 1.4;
    }

    .cart-page .assurances svg{
      width: 16px;
      height: 16px;
      flex: 0 0 auto;
      fill: none;
      stroke: var(--teal);
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    /* ===== LAYOUT ===== */
    .cart-page .cart-main{
      padding: 28px 0 72px;
    }

    .cart-page .cart-layout{
      display: grid;
      grid-template-columns: minmax(0, 1.55fr) minmax(330px, .72fr);
      gap: 26px;
      align-items: start;
    }

    .cart-page .panel{
      border: 1px solid var(--line);
      border-radius: 20px;
      background: #fff;
      box-shadow: var(--shadow);
      overflow: hidden;
    }

    .cart-page .panel-head{
      padding: 17px 18px 14px;
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 12px;
      border-bottom: 1px solid var(--line);
    }

    .cart-page .panel-title{
      margin: 0;
      font-size: .98rem;
      font-weight: 900;
    }

    .cart-page .item-count{
      color: var(--teal-soft);
      font-size: .69rem;
      white-space: nowrap;
    }

    /* ===== CART ITEMS ===== */
    .cart-page .cart-list{
      list-style: none;
      margin: 0;
      padding: 0 18px;
    }

    .cart-page .cart-item{
      position: relative;
      display: grid;
      grid-template-columns: 92px minmax(0, 1fr);
      gap: 15px;
      padding: 18px 0;
      border-bottom: 1px solid var(--line);
    }

    .cart-page .cart-item:last-child{
      border-bottom: 0;
    }

    .cart-page .product-thumb{
      width: 92px;
      height: 92px;
      overflow: hidden;
      border-radius: 15px;
      background: var(--soft);
    }

    .cart-page .product-thumb img{
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .cart-page .product-info{
      min-width: 0;
      padding-left: 34px;
    }

    .cart-page .product-name{
      margin: 0 0 4px;
      font-size: .86rem;
      font-weight: 900;
      line-height: 1.7;
    }

    .cart-page .product-name a{
      text-decoration: none;
    }

    .cart-page .product-name a:hover, .cart-page .product-name a:focus-visible{
      color: var(--pink-dark);
    }

    .cart-page .product-meta{
      max-width: 100%;
      margin: 0 0 7px;
      overflow: hidden;
      color: var(--teal-soft);
      font-size: .68rem;
      line-height: 1.55;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .cart-page .product-unit-price{
      margin: 0;
      color: var(--teal-soft);
      font-size: .67rem;
      line-height: 1.5;
    }

    .cart-page .item-actions{
      margin-top: 11px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .cart-page .qty{
      display: inline-flex;
      align-items: center;
      overflow: hidden;
      border: 1px solid var(--line-strong);
      border-radius: 10px;
      direction: ltr;
      background: #fff;
    }

    .cart-page .qty button{
      width: 34px;
      height: 32px;
      border: 0;
      background: #fff;
      color: var(--teal);
      cursor: pointer;
      touch-action: manipulation;
    }

    .cart-page .qty button:hover{
      background: var(--soft);
    }

    .cart-page .qty input{
      width: 38px;
      height: 32px;
      padding: 0;
      border: 0;
      outline: 0;
      background: #fff;
      color: var(--teal);
      text-align: center;
      font-size: .72rem;
      font-weight: 900;
      appearance: textfield;
      -moz-appearance: textfield;
    }

    .cart-page .qty input::-webkit-outer-spin-button, .cart-page .qty input::-webkit-inner-spin-button{
      margin: 0;
      -webkit-appearance: none;
    }

    .cart-page .line-total{
      font-size: .76rem;
      font-weight: 900;
      white-space: nowrap;
    }

    .cart-page .remove-item{
      position: absolute;
      top: 16px;
      left: 0;
      width: 28px;
      height: 28px;
      padding: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 0;
      border-radius: 8px;
      background: transparent;
      color: rgba(23,63,73,.42);
      cursor: pointer;
      font-size: 20px;
      line-height: 1;
      touch-action: manipulation;
    }

    .cart-page .remove-item:hover, .cart-page .remove-item:focus-visible{
      background: rgba(201,74,89,.07);
      color: var(--danger);
    }

    /* ===== CART FOOT ===== */
    .cart-page .cart-tools{
      padding: 15px 18px 17px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: end;
      border-top: 1px solid var(--line);
      background: var(--soft-2);
    }

    .cart-page .coupon-group{
      min-width: 0;
    }

    .cart-page .coupon-label{
      margin: 0 0 7px;
      font-size: .7rem;
      font-weight: 900;
    }

    .cart-page .coupon-row{
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 7px;
    }

    .cart-page .coupon-input{
      min-width: 0;
      height: 41px;
      padding: 0 11px;
      border: 1px solid var(--line-strong);
      border-radius: 10px;
      background: #fff;
      color: var(--teal);
      outline: 0;
    }

    .cart-page .coupon-input:focus{
      border-color: var(--teal);
      box-shadow: 0 0 0 3px rgba(23,63,73,.07);
    }

    .cart-page .secondary-button{
      min-height: 41px;
      padding: 0 14px;
      border: 1px solid var(--teal);
      border-radius: 10px;
      background: #fff;
      color: var(--teal);
      cursor: pointer;
      font-size: .7rem;
      font-weight: 900;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-align: center;
    }

    .cart-page .secondary-button:hover{
      background: rgba(23,63,73,.04);
    }

    .cart-page .update-cart{
      min-width: 128px;
    }

    .cart-page .update-cart[disabled]{
      cursor: default;
      opacity: .48;
    }

    .cart-page .cart-notice{
      display: none;
      margin: 10px 18px 0;
      padding: 10px 12px;
      border-radius: 10px;
      background: rgba(47,138,104,.08);
      color: var(--success);
      font-size: .65rem;
      line-height: 1.6;
    }

    .cart-page .cart-notice.is-visible{
      display: block;
    }

    /* ===== TOTALS ===== */
    .cart-page .cart-summary{
      position: sticky;
      top: 18px;
    }

    .cart-page .summary-body{
      padding: 14px 18px 7px;
    }

    .cart-page .summary-row{
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 16px;
      padding: 9px 0;
      color: var(--teal-soft);
      font-size: .72rem;
      line-height: 1.5;
    }

    .cart-page .summary-row strong{
      color: var(--teal);
      font-weight: 900;
      white-space: nowrap;
    }

    .cart-page .summary-row.grand{
      margin-top: 5px;
      padding: 15px 0 11px;
      border-top: 1px solid var(--line);
      color: var(--teal);
      font-size: .88rem;
      font-weight: 900;
    }

    .cart-page .summary-row.grand strong{
      font-size: 1.03rem;
    }

    .cart-page .summary-note{
      margin: 2px 0 0;
      color: var(--teal-soft);
      font-size: .61rem;
      line-height: 1.75;
    }

    .cart-page .summary-actions{
      padding: 15px 18px 18px;
      border-top: 1px solid var(--line);
      background: var(--soft-2);
    }

    .cart-page .checkout-button{
      width: 100%;
      min-height: 50px;
      padding: 10px 14px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid var(--pink);
      border-radius: 12px;
      background: var(--pink);
      color: #fff;
      font-size: .84rem;
      font-weight: 900;
      line-height: 1.5;
      text-align: center;
      text-decoration: none;
      transition: background .18s ease, border-color .18s ease, transform .18s ease;
    }

    .cart-page .checkout-button:hover, .cart-page .checkout-button:focus-visible{
      border-color: var(--pink-dark);
      background: var(--pink-dark);
      transform: translateY(-1px);
    }

    .cart-page .continue-link{
      margin-top: 11px;
      display: flex;
      justify-content: center;
      color: var(--teal-soft);
      font-size: .67rem;
      font-weight: 800;
      text-decoration: none;
    }

    .cart-page .continue-link:hover, .cart-page .continue-link:focus-visible{
      color: var(--teal);
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    .cart-page .secure-note{
      margin: 11px 0 0;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      color: var(--teal-soft);
      text-align: center;
      font-size: .61rem;
      line-height: 1.6;
    }

    .cart-page .secure-note svg{
      width: 14px;
      height: 14px;
      fill: none;
      stroke: var(--teal);
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .cart-page .support-note{
      margin-top: 12px;
      padding: 12px 14px;
      border: 1px solid var(--line);
      border-radius: 13px;
      background: #fff;
      color: var(--teal-soft);
      text-align: center;
      font-size: .66rem;
      line-height: 1.8;
    }

    .cart-page .support-note a{
      color: var(--teal);
      font-weight: 900;
      text-decoration: none;
      text-underline-offset: 3px;
    }

    .cart-page .support-note a:hover, .cart-page .support-note a:focus-visible{
      color: var(--pink-dark);
      text-decoration: underline;
    }

    /* ===== EMPTY CART REFERENCE ===== */
    .cart-page .empty-cart{
      display: none;
      max-width: 620px;
      margin: 0 auto;
      padding: 46px 24px 42px;
      border: 1px solid var(--line);
      border-radius: 20px;
      background: #fff;
      box-shadow: var(--shadow);
      text-align: center;
    }

    .cart-page .empty-icon{
      width: 88px;
      height: 88px;
      margin: 0 auto 17px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      background: var(--soft);
      color: var(--teal);
    }

    .cart-page .empty-icon svg{
      width: 40px;
      height: 40px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.7;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .cart-page .empty-cart h2{
      margin: 0 0 8px;
      font-size: 1.05rem;
      font-weight: 900;
    }

    .cart-page .empty-cart p{
      max-width: 440px;
      margin: 0 auto 20px;
      color: var(--teal-soft);
      font-size: .79rem;
      line-height: 1.9;
    }

    .cart-page .shop-button{
      width: min(100%, 280px);
      min-height: 48px;
      padding: 10px 14px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 12px;
      background: var(--pink);
      color: #fff;
      font-size: .82rem;
      font-weight: 900;
      text-decoration: none;
    }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 930px) {
      .cart-page .cart-layout{
        grid-template-columns: minmax(0, 1fr) 320px;
        gap: 18px;
      }
    }

    @media (max-width: 800px) {
      .cart-page .cart-layout{
        grid-template-columns: 1fr;
      }

      .cart-page .cart-summary{
        position: static;
      }
    }

    @media (max-width: 640px) {
      .cart-page{
        --gutter: 14px;
      }

      .cart-page .cart-top{
        padding: 18px 0 19px;
      }

      .cart-page .cart-main{
        padding: 18px 0 46px;
      }

      .cart-page .panel{
        border-radius: 15px;
        box-shadow: none;
      }

      .cart-page .cart-list{
        padding-inline: 14px;
      }

      .cart-page .cart-item{
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 11px;
        padding: 15px 0;
      }

      .cart-page .product-thumb{
        width: 72px;
        height: 72px;
        border-radius: 12px;
      }

      .cart-page .product-info{
        padding-left: 30px;
      }

      .cart-page .item-actions{
        align-items: flex-end;
      }

      .cart-page .cart-tools{
        grid-template-columns: 1fr;
        padding-inline: 14px;
      }

      .cart-page .update-cart{
        width: 100%;
      }

      .cart-page .panel-head, .cart-page .summary-body, .cart-page .summary-actions{
        padding-left: 14px;
        padding-right: 14px;
      }

      .cart-page .assurances{
        gap: 6px;
      }

      .cart-page .assurances span{
        flex: 1 1 calc(50% - 6px);
        justify-content: center;
        text-align: center;
      }
    }

    @media (max-width: 390px) {
      .cart-page .assurances span{
        flex-basis: 100%;
      }

      .cart-page .coupon-row{
        grid-template-columns: 1fr;
      }

      .cart-page .coupon-row .secondary-button{
        width: 100%;
      }

      .cart-page .cart-item{
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 10px;
      }

      .cart-page .product-thumb{
        width: 64px;
        height: 64px;
      }

      .cart-page .product-info{
        padding-left: 27px;
      }

      .cart-page .item-actions{
        display: grid;
        justify-items: start;
      }

      .cart-page .line-total{
        justify-self: start;
      }
    }

    @media (pointer: coarse) {
      .cart-page .qty button, .cart-page .remove-item, .cart-page .secondary-button, .cart-page .checkout-button{
        min-height: 44px;
      }

      .cart-page .remove-item{
        min-width: 44px;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .cart-page *, .cart-page *::before, .cart-page *::after{
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        scroll-behavior: auto !important;
      }
    }
  
