.cred-card{
        width:100%;
        margin:14px 0 18px;
        padding:18px;
        border:1px solid rgba(229,231,235,.9);
        border-radius:16px;
        background:linear-gradient(180deg,#ffffff 0%, #fbfbfd 100%);
        box-shadow:0 10px 30px rgba(17,24,39,.06);
        position:relative;
        overflow:hidden;
      }
      .cred-card:before{
        content:"";
        position:absolute;
        inset:-80px -80px auto auto;
        width:220px;height:220px;
        background:radial-gradient(circle at 30% 30%, rgba(59,130,246,.18), transparent 60%);
        pointer-events:none;
      }
      .cred-top{margin-bottom:16px;position:relative}
      .cred-badge{
        display:inline-flex;align-items:center;gap:8px;
        padding:7px 12px;
        border:1px solid rgba(209,213,219,.9);
        border-radius:999px;
        background:rgba(249,250,251,.9);
        font-size:12px;font-weight:900;color:#374151;
        margin-bottom:10px;
      }
      .cred-badge-icon{width:14px;height:14px}
      .cred-title{margin:0 0 6px 0;font-size:17px;font-weight:1000;color:#0f172a;letter-spacing:.1px}
      .cred-sub{margin:0;font-size:13px;color:#64748b}
      .cred-required{color:#ef4444;font-weight:bold;margin-right:2px}

      .cred-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
      .cred-field{display:flex;flex-direction:column;gap:7px}
      .cred-span2{grid-column:span 2}
      .cred-label{font-size:13px;font-weight:900;color:#334155}

      .cred-radio-group{display:flex;gap:10px;flex-wrap:wrap}
      .cred-radio-item{
        display:flex;align-items:center;gap:8px;
        padding:10px 16px;
        border:1px solid rgba(203,213,225,.9);
        border-radius:14px;
        background:#fff;
        cursor:pointer;
        transition:all .15s ease;
        font-size:14px;
        font-weight:900;
        color:#0f172a;
      }
      .cred-radio-item:has(input:checked){
        background:rgba(59,130,246,.1);
        border-color:rgba(59,130,246,.5);
        box-shadow:0 0 0 4px rgba(59,130,246,.12);
      }
      .cred-radio-item input[type="radio"]{
        width:18px;height:18px;
        cursor:pointer;
      }

      .cred-inp{position:relative}
      .cred-inp-ic{
        position:absolute;
        right:12px;
        top:50%;
        transform:translateY(-50%);
        width:18px;height:18px;
        color:#94a3b8;
        display:grid;place-items:center;
        pointer-events:none;
      }
      .cred-inp-ic svg{width:18px;height:18px}

      .cred-input{
        width:100%;
        height:46px;
        border:1px solid rgba(203,213,225,.9);
        border-radius:14px;
        padding:10px 44px 10px 12px;
        font-size:14px;
        background:#fff;
        transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;
        box-sizing:border-box;
        color:#0f172a;
      }
      .cred-input::placeholder{color:#94a3b8}
      .cred-input:focus{
        outline:none;
        border-color:rgba(59,130,246,.9);
        box-shadow:0 0 0 4px rgba(59,130,246,.12);
      }

      .cred-passwrap .cred-input{padding-left:50px}
      .cred-toggle{
        position:absolute;
        left:10px;
        top:50%;
        transform:translateY(-50%);
        width:34px;height:34px;
        border-radius:12px;
        border:1px solid rgba(226,232,240,.9);
        background:linear-gradient(180deg,#fff,#f8fafc);
        display:grid;place-items:center;
        cursor:pointer;
        transition:transform .12s ease, box-shadow .15s ease, border-color .15s ease;
      }
      .cred-toggle:hover{
        border-color:rgba(59,130,246,.55);
        box-shadow:0 10px 24px rgba(2,6,23,.10);
        transform:translateY(-50%) translateY(-1px);
      }
      .cred-toggle-ic{width:18px;height:18px;color:#334155}
      .cred-toggle .is-eyeoff{display:none}
      .cred-toggle.is-on .is-eye{display:none}
      .cred-toggle.is-on .is-eyeoff{display:block}

      .cred-select{position:relative}
      .cred-select-btn{
        width:100%;
        height:46px;
        border:1px solid rgba(203,213,225,.9);
        border-radius:14px;
        background:#fff;
        padding:10px 12px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        cursor:pointer;
        transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;
        color:#0f172a;
      }
      .cred-select-btn:hover{
        border-color:rgba(59,130,246,.55);
        box-shadow:0 10px 24px rgba(2,6,23,.10);
        transform:translateY(-1px);
      }
      .cred-select-btn:focus{
        outline:none;
        border-color:rgba(59,130,246,.9);
        box-shadow:0 0 0 4px rgba(59,130,246,.12);
      }
      .cred-select-left{display:flex;align-items:center;gap:10px;min-width:0}
      .cred-select-ic{
        width:28px;height:28px;
        border-radius:12px;
        border:1px solid rgba(226,232,240,.9);
        background:linear-gradient(180deg,#fff,#f8fafc);
        display:grid;place-items:center;
        flex:0 0 28px;
        color:#0f172a;
      }
      .cred-select-ic svg{width:16px;height:16px}
      .cred-select-text{
        font-weight:900;
        font-size:14px;
        color:#0f172a;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
      }
      .cred-select-caret{width:18px;height:18px;color:#64748b;display:grid;place-items:center;transition:transform .15s ease}
      .cred-select.is-open .cred-select-caret{transform:rotate(180deg)}
      .cred-select-menu{
        position:absolute;
        top:calc(100% + 8px);
        right:0;
        left:0;
        background:#fff;
        border:1px solid rgba(226,232,240,.95);
        border-radius:16px;
        box-shadow:0 18px 44px rgba(2,6,23,.14);
        padding:8px;
        max-height:320px;
        overflow-y:auto;
        display:none;
        z-index:9999;
        scrollbar-width:thin;
        scrollbar-color:rgba(148,163,184,.4) transparent;
      }
      .cred-select-menu::-webkit-scrollbar{width:8px}
      .cred-select-menu::-webkit-scrollbar-track{background:transparent}
      .cred-select-menu::-webkit-scrollbar-thumb{
        background:rgba(148,163,184,.4);
        border-radius:10px;
      }
      .cred-select-menu::-webkit-scrollbar-thumb:hover{background:rgba(148,163,184,.6)}
      .cred-select.is-open .cred-select-menu{display:block}
      .cred-opt{
        width:100%;
        display:flex;
        align-items:center;
        gap:10px;
        padding:10px 10px;
        border-radius:14px;
        border:1px solid transparent;
        background:transparent;
        cursor:pointer;
        text-align:right;
        transition:background .15s ease, border-color .15s ease, transform .12s ease;
      }
      .cred-opt:hover{
        background:rgba(59,130,246,.08);
        border-color:rgba(59,130,246,.18);
        transform:translateY(-1px);
      }
      .cred-opt[aria-selected="true"]{
        background:rgba(59,130,246,.12);
        border-color:rgba(59,130,246,.22);
      }
      .cred-opt-ic{
        width:32px;height:32px;
        border-radius:14px;
        border:1px solid rgba(226,232,240,.9);
        background:linear-gradient(180deg,#fff,#f8fafc);
        display:grid;place-items:center;
        flex:0 0 32px;
        color:#0f172a;
      }
      .cred-opt-ic svg{width:16px;height:16px}
      .cred-opt-txt{font-weight:900;font-size:14px;color:#0f172a}

      @media(max-width:680px){
        .cred-grid{grid-template-columns:1fr}
        .cred-span2{grid-column:span 1}
        .cred-card{padding:16px;border-radius:14px}
        .cred-select-menu{max-height:280px}
        .cred-radio-group{flex-direction:column}
      }

















.variations{ display:none !important; }
.single_variation{ display:none !important; }

.oscar-dev-box{
    margin: 16px 0;
    font-family: "Cairo","Tajawal",-apple-system,sans-serif;
    direction: rtl;
}

.oscar-dev-attr-title{
    font-size: 14px;
    font-weight: 800;
    color: #1f2937;
    margin: 0 0 12px 0;
}

.oscar-dev-options{
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    margin-bottom: 18px;
}

.oscar-dev-option{
    background: #fff;
    border: 1.5px solid #e0e0e0;
    border-radius: 12px;
    padding: 12px;
    cursor: pointer;
    transition: all .18s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 6px;
    min-height: 74px;
    position: relative;
}
.oscar-dev-option:hover{
    border-color: rgba(138,14,14,.55);
    background: rgba(138,14,14,.02);
}
.oscar-dev-option.selected{
    background: #8a0e0e;
    border-color: #8a0e0e;
    box-shadow: 0 10px 24px rgba(138,14,14,.25);
    transform: translateY(-1px);
}
.oscar-dev-option.disabled{
    opacity: .35;
    cursor: not-allowed;
    background: #fafafa;
    filter: grayscale(1);
}

.oscar-dev-label{
    font-size: 13px;
    font-weight: 800;
    color: #1f2937;
    line-height: 1.25;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 32px;
}
.oscar-dev-option.selected .oscar-dev-label{ color:#fff; }

.oscar-dev-option-price{
    font-size: 14px;
    font-weight: 900;
    color: #8a0e0e;
    line-height: 1.1;
}
.oscar-dev-option.selected .oscar-dev-option-price{ color: rgba(255,255,255,.95); }

.oscar-dev-check{
    position: absolute;
    top: 10px;
    left: 10px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
}
.oscar-dev-option.selected .oscar-dev-check{ display:flex; }
.oscar-dev-check::after{
    content: "✓";
    color: #8a0e0e;
    font-size: 12px;
    font-weight: 900;
}

.oscar-dev-meta{ margin-top: 8px; }

.oscar-dev-stock-alert{
    display:none;
    align-items:center;
    gap:10px;
    padding: 12px 14px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 12px;
    color: #991b1b;
    font-size: 13px;
    font-weight: 800;
}
.oscar-dev-stock-alert.show{ display:flex; }

.oscar-dev-reset-row{ display:none; justify-content:flex-end; margin-top: 12px; }
.oscar-dev-reset-row.show{ display:flex; }
.oscar-dev-resetBtn{
    background: transparent;
    border: 1px solid #e0e0e0;
    color: #8a0e0e;
    border-radius: 10px;
    padding: 8px 18px;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

@media (max-width: 640px){
    .oscar-dev-options{
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }
    .oscar-dev-option{
        min-height: 70px;
        padding: 12px;
    }
}