/* کادر راهنما */
.wcm-guide-box {background: #f8fafc;border: 1px solid #e2e8f0;padding: 20px;border-radius: 8px;margin:20px 0;}
.wcm-guide-box h3 { margin-top: 0; color: #1e293b; font-size: 18px; }
.wcm-guide-box p, .wcm-guide-box ul { color: #475569; font-size: 14px; line-height: 1.8;margin-bottom: 0; }
.wcm-guide-box li { margin-bottom:0px; }
.wcm-guide-box strong { color: #0f172a; }


/* استایل های مربوط به لیست (مرحله اول قبل از ادیت) */
.wcm-list-wrapper { display: flex; flex-direction: column; gap: 15px;}
.wcm-list-item {display: flex;align-items: center;justify-content: space-between;padding: 20px;border-radius: 8px; border: 1px solid #e2e8f0;flex-wrap: wrap;gap: 15px;transition: transform 0.2s;}
.wcm-col-info { flex: 2; min-width: 200px; }
.wcm-product-title { font-weight: bold; color: #1e293b; font-size: 16px; margin-bottom: 5px; }
.wcm-order-id { font-size: 13px; color: #64748b; }
.wcm-col-status, .wcm-col-domain { flex: 1; min-width: 150px; }
.wcm-label { font-size: 12px; color: #94a3b8; margin-bottom: 4px; }
.wcm-value { font-size: 14px; color: #334155;text-align: right; }
.wcm-col-action { flex: 1; text-align: left; min-width: 150px; }

/* پس زمینه های داینامیک لیست */
.wcm-bg-unregistered { background: #fafafa; border-right: 4px solid #cbd5e1; }
.wcm-bg-active { background: #f0fdf4; border-right: 4px solid #15C502; border-color: #bbf7d0; }
.wcm-bg-inactive { background: #fffbeb; border-right: 4px solid #f59e0b; border-color: #fde68a; }
.wcm-bg-blocked { background: #fef2f2; border-right: 4px solid #ef4444; border-color: #fecaca; }

/* دکمه ها */
.wcm-btn {display: inline-block; padding: 10px 18px; border-radius: 4px; font-size: 14px;font-weight: normal; cursor: pointer; text-align: center; border: none; transition: 0.2s; text-decoration: none;font-family: Num-Medium, sans-serif !important;}
.wcm-btn-primary { background: #3b82f6; color: #fff; }
.wcm-btn-primary:hover { background: #2563eb; color: #fff; }
.wcm-btn-secondary { background: #E5E7EB; color: #999;  padding: 15px;}
.wcm-btn-secondary:hover {opacity:0.8; }
.wcm-btn-success { background: #10b981; color: #fff; }
.wcm-btn-success:hover { background: #059669; color: #fff; }
.wcm-btn-warning { background: #f59e0b; color: #fff; }
.wcm-btn-warning:hover { background: #d97706; color: #fff; }
.wcm-btn-full { width: 100%; display: block; margin-top: 15px; }

/* استایل های صفحه اختصاصی ویرایش لایسنس */
.wcm-license-item { background: #fff; padding: 24px; border-radius: 8px;  }
.wcm-license-details { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; margin: 20px 0; }
.wcm-detail-box { background: #fff; padding: 12px 16px; border-radius: 8px; display: flex; flex-direction: column; gap: 6px; border: 2px solid #F6F6F8; }
.wcm-detail-box.full-width { grid-column: 1 / -1; }
.wcm-detail-box.key-box { flex-direction: row; align-items: center; justify-content: space-between; background: #f8fafc; }
.wcm-detail-label { font-size: 14px; color: #444 !important; font-weight: normal !important; font-family: Num-Medium, sans-serif !important;}
.wcm-detail-value { font-size: 14px; color: #0f172a; font-weight: 600;text-align: right; }
.wcm-code-box { background: #fff; padding: 8px 16px; border-radius: 6px;  font-size: 15px; letter-spacing: 1px; color: #888; user-select: all; }

/* بج ها و آلارم ها */
.wcm-status-badge { display: inline-block; padding: 4px 10px; border-radius: 20px; font-size: 12px; }
.wcm-status-active { background: #dcfce7; color: #166534; }
.wcm-status-inactive { background: #fef3c7; color: #92400e; }
.wcm-alert-box { padding: 12px 15px; border-radius: 8px; border: 1px solid transparent; font-size: 13px; line-height: 1.6; margin-bottom:15px; }
.wcm-alert-info { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }
.wcm-alert-danger { background: #fef2f2; border-color: #fecaca; color: #ef4444; font-weight: bold; }

/* مودال (پاپ آپ) */
.wcm-modal { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); align-items: center; justify-content: center; backdrop-filter: blur(4px); }
.wcm-modal-content { background-color: #fefefe; padding: 30px; border-radius: 12px; width: 90%; max-width: 400px; position: relative; box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1); }
.wcm-close-btn { position: absolute; top: 15px; left: 15px; font-size: 24px; cursor: pointer; color: #94a3b8; }
.wcm-input { width: 100%; padding: 10px; border: 1px solid #cbd5e1; border-radius: 6px; box-sizing: border-box; }

/* لودر ایجکس */
.wcm-loader { text-align: center; padding: 40px; color: #64748b; font-weight: bold; }
.wcm-error { text-align: center; padding: 20px; color: #ef4444; background: #fef2f2; border-radius: 8px; }

/* انیمیشن تیک سبز */
.wcm-checkmark { width: 80px; height: 80px; border-radius: 50%; display: block; stroke-width: 4; stroke: #15C502; stroke-miterlimit: 10; box-shadow: inset 0px 0px 0px #15C502; animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both; margin: 0 auto; }
.wcm-checkmark__circle { stroke-dasharray: 166; stroke-dashoffset: 166; stroke-width: 4; stroke-miterlimit: 10; stroke: #15C502; fill: none; animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards; }
.wcm-checkmark__check { transform-origin: 50% 50%; stroke-dasharray: 48; stroke-dashoffset: 48; animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards; }
@keyframes stroke { 100% { stroke-dashoffset: 0; } }
@keyframes scale { 0%, 100% { transform: none; } 50% { transform: scale3d(1.1, 1.1, 1); } }
@keyframes fill { 100% { box-shadow: inset 0px 0px 0px 30px rgba(34, 197, 94, 0.1); } }

/* صفحه بندی */
.wcm-pagination { margin: 30px 0; display: flex; gap: 5px; justify-content: center; }
.wcm-pagination a, .wcm-pagination span { padding: 8px 15px; border-radius: 6px; color: #333; text-decoration: none; background: #fff; border: 1px solid #e2e8f0; }
.wcm-pagination .current { background: #15C502; color: #fff; border-color: #15C502; }

#wcm-main-container{margin: 20px;}