
.ssp-app,.ssp-app *{box-sizing:border-box}
.ssp-app{direction:rtl;text-align:right;font-family:Arial,Helvetica,sans-serif;max-width:100%;color:#111827;line-height:1.4}
.ssp-shell{display:grid;grid-template-columns:420px minmax(0,1fr);gap:18px;align-items:start}
.ssp-sidebar,.ssp-main{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:14px;min-width:0}
.ssp-sidebar{position:sticky;top:20px;max-height:calc(100vh - 40px);overflow:auto}
.ssp-sidebar-top,.ssp-headerbar,.ssp-statsbar,.ssp-product-bulkbar,.ssp-cat-bulkbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.ssp-headerbar{justify-content:space-between}
.ssp-left-actions,.ssp-right-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ssp-statsbar{font-size:13px;color:#4b5563;border-bottom:1px solid #f1f5f9;padding-bottom:10px;justify-content:space-between}
.ssp-cat-search,.ssp-product-search,.ssp-new-name,.ssp-new-price,.ssp-new-sale-price,.ssp-new-categories,.ssp-bulk-cat-input,.ssp-move-parent-name,.ssp-card-cats,.ssp-cat-picker-search{width:100%;padding:10px 12px;border:1px solid #d1d5db;border-radius:10px;background:#fff;min-width:0;font:inherit}
.ssp-right-actions .ssp-product-search{width:240px}
.ssp-sort-by,.ssp-extra-filter{padding:10px 12px;border:1px solid #d1d5db;border-radius:10px;background:#fff;font:inherit}
.ssp-category-tree{display:flex;flex-direction:column;gap:10px}
.ssp-cat-item{border:1px solid #e5e7eb;border-radius:14px;background:#fafafa;overflow:hidden}
.ssp-cat-row{display:grid;grid-template-columns:24px 24px minmax(0,1fr) 24px 24px;gap:8px;align-items:center;padding:10px}
.ssp-cat-checkbox{margin:0}
.ssp-cat-toggle,.ssp-cat-template,.ssp-cat-edit{cursor:pointer;border:none;background:none;padding:0;width:24px;height:24px;line-height:24px;text-align:center;font-size:14px}
.ssp-no-toggle{display:inline-block;width:24px;height:24px}
.ssp-cat-name{cursor:pointer;font-weight:600;color:#111827;min-width:0;white-space:normal;overflow-wrap:anywhere;word-break:normal;line-height:1.5;writing-mode:horizontal-tb!important;text-orientation:mixed!important;display:block}
.ssp-cat-name:hover{color:#2563eb}
.ssp-cat-children{display:none;padding:0 18px 12px 12px}
.ssp-cat-item.open>.ssp-cat-children{display:block}
.ssp-cat-meta{display:none;padding:0 12px 12px 12px;gap:8px;flex-direction:column}
.ssp-cat-item.editing>.ssp-cat-meta{display:flex}
.ssp-cat-meta input,.ssp-cat-meta textarea{width:100%;padding:9px 11px;border:1px solid #d1d5db;border-radius:10px;min-width:0;font:inherit}
.ssp-products-grid{display:grid;grid-template-columns:repeat(var(--ssp-desktop-cols,5),minmax(0,1fr));gap:14px;align-items:start}
.ssp-card{border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;background:#fff;display:flex;flex-direction:column;min-width:0}
.ssp-card-top{position:relative}
.ssp-card-image-wrap{aspect-ratio:1/1;background:#f8fafc;display:flex;align-items:center;justify-content:center;overflow:hidden}
.ssp-card-image-wrap img{max-width:100%;max-height:100%;display:block;object-fit:contain;border:0;box-shadow:none}
.ssp-image-tools{position:absolute;top:8px;left:8px;display:flex;gap:6px;z-index:2}
.ssp-iconbtn{border:none;background:rgba(255,255,255,.94);width:30px;height:30px;border-radius:999px;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.08);display:flex;align-items:center;justify-content:center;font-size:13px}
.ssp-card-body{padding:12px;display:flex;flex-direction:column;gap:8px;min-width:0}
.ssp-inline{padding:9px 11px;border:1px solid #e5e7eb;border-radius:10px;background:#fff;cursor:text;min-height:42px;line-height:1.5;min-width:0;white-space:normal;overflow-wrap:anywhere;word-break:normal}
.ssp-inline[contenteditable=true]:focus{outline:none;border-color:#2563eb}
.ssp-mini{font-size:12px;color:#6b7280;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
.ssp-desc-preview{font-size:13px;color:#374151;min-height:42px;line-height:1.6;white-space:normal;overflow-wrap:anywhere}
.ssp-card-actions{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.ssp-var-badge{display:inline-block;padding:3px 8px;border-radius:999px;font-size:11px;background:#eff6ff;color:#1d4ed8;font-weight:700}
.ssp-modal{position:fixed;inset:0;background:rgba(15,23,42,.42);display:flex;align-items:center;justify-content:center;padding:20px;z-index:99999}
.ssp-modal-card{width:min(640px,100%);background:#fff;border-radius:18px;overflow:hidden}
.ssp-modal-large{width:min(1100px,100%)}
.ssp-modal-head,.ssp-modal-foot{padding:14px 16px;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between}
.ssp-modal-foot{border-top:1px solid #e5e7eb;border-bottom:none}
.ssp-modal-body{padding:16px;display:flex;flex-direction:column;gap:10px;max-height:80vh;overflow:auto}
.ssp-close-modal{border:none;background:none;font-size:24px;cursor:pointer}
.ssp-empty{padding:30px 10px;text-align:center;color:#6b7280}
.ssp-loading{padding:16px;text-align:center;color:#374151}
.ssp-denied{padding:16px;border:1px solid #fecaca;background:#fff1f2;border-radius:12px}
.ssp-ghost{opacity:.45}
.ssp-app .button{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:10px;border:1px solid #d1d5db;background:#fff;cursor:pointer;line-height:1.2;text-decoration:none;font:inherit}
.ssp-app .button-primary{background:#9f2d18;color:#fff;border-color:#9f2d18}
.ssp-app .button-secondary{background:#fff;color:#374151;border-color:#d1d5db}
.ssp-hover-tools{opacity:0;pointer-events:none;transition:opacity .2s ease}
.ssp-card:hover .ssp-hover-tools{opacity:1;pointer-events:auto}
.ssp-open-cat-picker{min-width:140px}
.ssp-cat-picker-list{display:flex;flex-direction:column;gap:8px;max-height:320px;overflow:auto;border:1px solid #e5e7eb;border-radius:12px;padding:10px;background:#fafafa}
.ssp-picker-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:#fff;cursor:pointer}
.ssp-picker-item input{width:16px;height:16px}
.ssp-var-row{display:grid;grid-template-columns:2fr 1fr 1fr 120px 120px 80px 80px;gap:8px;align-items:center;padding:10px;border:1px solid #e5e7eb;border-radius:12px;margin-bottom:8px;background:#fff}
.ssp-var-title{font-weight:700;font-size:13px;line-height:1.4;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ssp-var-attrs{display:contents!important}
.ssp-var-attr{display:flex;flex-direction:column;gap:3px;font-size:11px}
.ssp-var-attr span{color:#6b7280;font-size:10px}
.ssp-var-row input,.ssp-var-row select{width:100%;height:36px;padding:6px 8px;border:1px solid #d1d5db;border-radius:8px;font-size:12px;box-sizing:border-box}
.ssp-var-actions{display:contents!important}
.ssp-var-actions .button,.ssp-save-var,.ssp-delete-var{height:36px;padding:6px 10px;font-size:12px}
.ssp-app[data-frontend="1"],.ssp-app[data-frontend="1"] *{font-family:Arial,Helvetica,sans-serif!important}
.ssp-app[data-frontend="1"]{all:initial;display:block;direction:rtl;text-align:right;font-family:Arial,Helvetica,sans-serif!important;color:#111827;line-height:1.4}
.ssp-app[data-frontend="1"] *,.ssp-app[data-frontend="1"] *::before,.ssp-app[data-frontend="1"] *::after{box-sizing:border-box}
.ssp-app[data-frontend="1"] button,.ssp-app[data-frontend="1"] input,.ssp-app[data-frontend="1"] select,.ssp-app[data-frontend="1"] textarea{font:inherit!important;color:inherit!important;background:#fff!important;border:1px solid #d1d5db!important;border-radius:10px!important;box-shadow:none!important;text-transform:none!important;letter-spacing:normal!important}
.ssp-app[data-frontend="1"] .button-primary{background:#9f2d18!important;color:#fff!important;border-color:#9f2d18!important}
@media(max-width:1200px){.ssp-products-grid{grid-template-columns:repeat(var(--ssp-tablet-cols,3),minmax(0,1fr))}}
@media(max-width:1024px){.ssp-shell{grid-template-columns:1fr}.ssp-sidebar{position:relative;top:0;max-height:none}}
@media(max-width:900px){.ssp-var-row{grid-template-columns:1fr}.ssp-var-attrs,.ssp-var-actions{display:flex!important;flex-direction:column;gap:8px}.ssp-var-title{white-space:normal}}
@media(max-width:767px){.ssp-products-grid{grid-template-columns:repeat(var(--ssp-mobile-cols,2),minmax(0,1fr))}.ssp-cat-row{grid-template-columns:24px 24px minmax(0,1fr) 24px 24px}.ssp-right-actions .ssp-product-search{width:100%}}


/* v5.6 variations add row + cleaner category picker order UI */
.ssp-var-addbar{
    display:grid;
    grid-template-columns:1.2fr 2fr 120px 120px 90px;
    gap:8px;
    align-items:center;
    padding:12px;
    border:1px solid #c7d2fe;
    border-radius:12px;
    margin-bottom:12px;
    background:#f8fafc;
}
.ssp-var-addbar strong{
    font-size:13px;
}
.ssp-var-addbar .ssp-var-attrs{
    display:contents!important;
}
.ssp-category-picker-modal .ssp-modal-card{
    width:min(760px,100%);
}
.ssp-cat-picker-list{
    direction:rtl;
}
@media(max-width:900px){
    .ssp-var-addbar{
        grid-template-columns:1fr;
    }
    .ssp-var-addbar .ssp-var-attrs{
        display:flex!important;
        flex-direction:column;
        gap:8px;
    }
}


/* v5.7 UX refinements */
.ssp-new-type{
    width:100%;
    padding:10px 12px;
    border:1px solid #d1d5db;
    border-radius:10px;
    background:#fff;
    font:inherit;
}
.ssp-card-variations-btn{
    width:100%;
    justify-content:center;
}
.ssp-var-row{
    grid-template-columns:2fr 1fr 1fr 1fr 120px 120px 80px 40px !important;
}
.ssp-var-addbar{
    grid-template-columns:90px 1fr 1fr 1fr 120px 120px !important;
    direction:ltr;
}
.ssp-var-addbar .ssp-var-attrs,
.ssp-var-row .ssp-var-attrs{
    display:contents!important;
}
.ssp-var-addbar .ssp-var-attr,
.ssp-var-row .ssp-var-attr{
    direction:rtl;
}
.ssp-var-row .ssp-save-var{
    height:36px;
}
.ssp-var-row .ssp-delete-var{
    width:36px;
    height:36px;
    background:#fff;
    color:#991b1b;
}
.ssp-variations-table{
    min-width:980px;
}
.ssp-variations-modal .ssp-modal-body{
    overflow:auto;
}
@media(max-width:900px){
    .ssp-var-row,
    .ssp-var-addbar{
        grid-template-columns:1fr !important;
        direction:rtl;
    }
    .ssp-variations-table{
        min-width:0;
    }
}


/* v5.9 Category picker as real tree */
.ssp-category-picker-modal .ssp-modal-card{
    width:min(760px,100%);
}
.ssp-cat-picker-list{
    direction:rtl;
    max-height:420px;
    overflow:auto;
    padding:12px;
}
.ssp-picker-parent{
    margin:6px 0;
}
.ssp-picker-parent-title{
    font-weight:700;
    color:#374151;
    padding:8px 10px;
    border-radius:10px;
    background:#f3f4f6;
    margin-bottom:6px;
}
.ssp-picker-children{
    margin-right:22px;
    padding-right:14px;
    border-right:2px dashed #d1d5db;
}
.ssp-picker-leaf{
    margin:6px 0;
}
.ssp-picker-parent[data-depth="0"] > .ssp-picker-parent-title{
    background:#eef2ff;
}
.ssp-picker-parent[data-depth="1"] > .ssp-picker-parent-title{
    background:#f8fafc;
}

/* v5.9 Move only the tiny select arrow in variation modal, do not flip the layout */
.ssp-variations-modal .ssp-var-row,
.ssp-variations-modal .ssp-var-addbar{
    direction:inherit !important;
}
.ssp-variations-modal .ssp-var-row select,
.ssp-variations-modal .ssp-var-addbar select{
    direction:ltr !important;
    text-align:center !important;
    padding-left:28px !important;
    padding-right:10px !important;
    background-position:left 8px center !important;
}
.ssp-variations-modal .ssp-var-title{
    direction:rtl !important;
    text-align:right !important;
}
.ssp-variations-modal .ssp-var-row input,
.ssp-variations-modal .ssp-var-addbar input{
    direction:ltr !important;
    text-align:center !important;
}
