.zr-ai-button { background:#facc15;color:#000;padding:12px 24px;font-weight:600;border:none;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:15px;transition:background-color .3s,color .3s;position:relative;min-width:100%; } .zr-ai-button.loading { background:#fff !important;color:#000 !important; } .zr-ai-button img { width:20px;height:20px;animation:spin 1s linear infinite;display:none; } .zr-ai-button.loading img { display:inline-block; } .zr-ai-button.loading span { display:none; } .zr-ai-button:hover { background:#ffaf18; } @keyframes spin {from{transform:rotate(0deg);}to{transform:rotate(360deg);}} .zrth-btadd-wrapper { background:#e2edff;padding:7px;border-radius:11px;display:inline-block; transition:.3s;cursor:pointer;text-decoration:none; } .zrth-btadd-icon { position:relative;display:flex;align-items:center;justify-content:center; border-radius:8px;color:#0d6efd;transition:color .3s ease; } .zrth-btadd-wrapper:hover { background:#0d6efd;color:#fff; } .zrth-btadd-wrapper:hover .zrth-btadd-svg path { stroke:#fff !important; } .zrth-btadd-tooltip { position:absolute;bottom:100%;left:50%; transform:translateX(-50%) translateY(0); background:#0d6efd;color:#fff;font-size:11px;padding:4px 8px; border-radius:4px;white-space:nowrap;opacity:0;visibility:hidden; pointer-events:none;z-index:100;transition:opacity .25s, transform .25s; } .zrth-btadd-wrapper:hover .zrth-btadd-tooltip { opacity:1;visibility:visible;transform:translateX(-50%) translateY(-10px); } .scroll-box::before { content:""; position:absolute;top:0;left:0;right:0;bottom:0; border-radius:12px; padding:3px; background:linear-gradient(90deg,orange,gold,violet,orange); background-size:300% 300%; animation:animated-border 4s linear infinite; -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; z-index:-1; } @keyframes animated-border { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } <style> .zarinprc-discount-badge { position: relative; display: inline-block; background: linear-gradient(135deg, #ff3c00, #ff9800); color: #fff; padding: 6px 12px; border-radius: 20px; font-weight: bold; font-size: 13px; margin-top: 10px; box-shadow: 0 0 12px rgba(255,85,0,0.7); overflow: hidden; z-index: 1; } .zarinprc-discount-badge::before { content: ''; position: absolute; top: 0; left: -75%; width: 50%; height: 100%; background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100%); transform: skewX(-25deg); animation: shinyMove 1.8s infinite; z-index: 2; } @keyframes shinyMove { 0% {left: -75%;} 100% {left: 125%;} } .custom-download-btn { width: 100%; background-color: #49CD72; color: #fff; font-family: "Zarin-font", Sans-serif; font-size: 14px; font-weight: 600; letter-spacing: 0; border-radius: 9px; padding: 18px 5px 19px 5px; border: none; display: flex; justify-content: center; align-items: center; gap: 10px; cursor: pointer; transition: 0.3s all; } .custom-download-btn:hover { background: #2DBB59; } .custom-download-btn .download-icon { width: 20px; height: 20px; } @keyframes z-pulse{ 0%{transform:scale(1);opacity:1} 50%{transform:scale(1.08);opacity:.85} 100%{transform:scale(1);opacity:1} } @keyframes z-blink{ 0%,100%{opacity:1} 50%{opacity:.4} } @keyframes z-bump{ 0%{transform:scale(1);opacity:1} 50%{transform:scale(1.4);opacity:.6} 100%{transform:scale(1);opacity:1} } .z-visitors{ display:flex; flex-direction:column; align-items:center; font-family:"Zarin-font",sans-serif } .z-wrapper{ position:relative; display:flex; align-items:center; justify-content:center } .z-number{ font-size:22px; font-weight:600; color:#6d22ff; animation:z-pulse 3s ease-in-out infinite; transition:.3s } .z-icon{ position:absolute; right:-16px; top:-11px; font-size:18px; color:#9057ff; animation:z-blink 2.5s infinite } .z-text{ margin-top:5px; font-size:13px; font-weight:500; color:#334155; letter-spacing:-.2px } .z-bump{ animation:z-bump .3s ease } .dic-download-modal { display: none; position: fixed; z-index: 9999; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #fff; border-radius: 8px; padding: 20px; width: 550px; max-width: 90%; box-shadow: 0 2px 10px rgba(0,0,0,0.3); opacity: 0; transition: opacity 0.3s ease-in-out; } .dic-modal-content { padding: 20px; } .dic-modal-close { position: absolute; top: -10px; right: -10px; width: 30px; height: 30px; font-size: 18px; font-weight: bold; cursor: pointer; background: #fff; border: none; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 5px rgba(0,0,0,0.2); } .dic-download-modal ul { list-style-type: none; padding: 0; } .dic-download-item { transition: 0.3s all; border: 1px solid #f1f1f1; background: #f1f1f1; padding: 12px; margin: 8px 0; display: flex; align-items: center; font-size: 16px; border-radius: 8px; } .dic-item-icon, .dic-arrow-icon { width: 20px; height: 20px; margin-right: 10px; order: -1; } .dic-download-modal ul li a:hover { color: #0093ff!important; } .dic-download-product-btn { background: #ff9c03; color: #fff; padding: 12px 20px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px; display: flex; align-items: center; transition: background 0.3s ease; } .dic-download-product-btn:hover { background: #f08c01; } .dic-blur-background { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); backdrop-filter: blur(5px); z-index: 9998; opacity: 0; transition: opacity 0.3s ease-in-out; } body.modal-open { overflow: hidden; } li.dic-download-item { display: flex ; flex-direction: row-reverse; justify-content: space-between; } .dic-download-modal ul li a { color: #1e1e1e !important; font-weight: 500!important; transition: 0.3s all; text-decoration: none; } .dic-modal-content { padding: 0px!important; } img.dic-item-icon { fill: #4cbd00; color: #4cbd00; } button.dic-modal-close { height: 35px; width: 35px; top: -15px; right: -15px; } .dic-download-product-btn { background-color: #13D659; color: #FFFFFF; font-size: 15px; padding: 14px; border-radius: 8px; display: flex; align-items: center; justify-content: center; border: none; cursor: pointer; transition: background 0.3s ease; } .dic-download-product-btn:hover { background: #12c458; } .dic-arrow-icon { width: 20px; height: 20px; margin-right: 10px; fill: #FFFFFF; color: #FFFFFF; } button.dic-download-product-btn { display: flex ; flex-direction: row-reverse; } button.dic-download-product-btn:hover { color: #ffffffde; } button.dic-download-product-btn { display: flex ; flex-direction: row-reverse; background: #13D659; padding: 14px; border-radius: 8px; font-size: 14px; color: #fff; } img.dic-arrow-icon { width: 15px; height: 15px; } li.dic-download-item:hover { border: 1px solid #0000001f; background: #fff; } button.dic-download-product-btn { font-family: 'Zarin-font' !important; font-weight: 500 !important; font-size: 14px !important; } button.wbdiac-show-licenses-btn { color: #6097F3 !important; background: #edf3ff !important; font-family: 'Zarin-font' !important; font-weight: 500!Important; font-size: 14px !important; } button.wbdiac-show-licenses-btn:hover { background: #d3e2ff !important; } .dic-download-modal ul li a { font-family: 'Zarin-font' !important; font-weight: 500 !important; } p.wbdiac-license-count-product { font-family: 'Zarin-font' !important; } .zr-post-tags { display: flex; flex-wrap: wrap; gap: 10px; } .zr-post-tag { display: flex; align-items: center; background: #f9fafb; color: #334155; font-size: 14px; font-weight: 500; padding: 6px 12px; border-radius: 8px; transition: background 0.3s; text-decoration: none; } .zr-post-tag:hover { background: #e0e7ff; } .zr-post-tag img { width: 16px; height: 16px; margin-left: 6px; } @media (max-width:480px) { .zr-post-tag { font-size:13px; padding:5px 10px; } .zr-post-tag img { width:14px; height:14px; margin-left:4px; } } .latest-comments-list{list-style:none;padding:0;margin:0} .latest-comment-item{padding:10px 0} .latest-comment-item:not(:last-child){border-bottom:1px solid #f4f5f7} a.latest-comment-link{text-decoration:none;color:#334155;display:flex;flex-direction:column;transition:color .3s ease;font-size:14px;font-weight:500;letter-spacing:-0.3px;max-width:100%} a.latest-comment-link:hover{color:#6D22FF} .comment-author{margin-bottom:4px} .comment-content-wrapper{display:inline-flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%} .comment-text{max-width:88%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block} .hover-icon{width:16px;height:16px;margin-left:8px;opacity:0;transition:opacity .3s ease;flex-shrink:0} a.latest-comment-link:hover .hover-icon{opacity:1} .no-comments{color:#94a3b8;font-size:14px;padding:10px 0} .latest-posts-list{list-style:none;padding:0;margin:0} .latest-post-item{padding:15px 0} .latest-post-item:not(:last-child){border-bottom:1px solid #f4f5f7} a.latest-post-link{font-size:14px;font-weight:500;color:#334155;text-decoration:none;display:inline-flex;align-items:center;transition:color .3s ease;max-width:100%} a.latest-post-link:hover{color:#6D22FF} .latest-post-link .title-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:88%} .latest-post-link .hover-icon{width:16px;height:16px;margin-left:8px;opacity:0;transition:opacity .3s ease} a.latest-post-link:hover .hover-icon{opacity:1} .repeat-purchase-button { display: flex; align-items: center; gap: 8px; border: none; border-radius: 10px; cursor: pointer; flex-direction: row-reverse; background: #ffbe00; font-family: 'Zarin-font'; padding: 14px 25px; color: #334155; font-weight: 600; font-size: 14px; transition: background 0.4s ease; } .repeat-purchase-button:hover { background: #ffa700; color:#334155 } .repeat-purchase-button img { width: 16px; height: 16px; } .custom-thankyou-box { background-image: linear-gradient(180deg, #FFFFFF 0%, #F6FFF8 100%); background-size: cover; padding: 20px; border: 3px solid #F5F5F5; border-radius: 10px; display: flex; flex-direction: column; align-items: center; width: 100%; margin: auto; opacity: 0; animation: fadeIn 1s forwards; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .custom-order-info { display: flex; gap: 20px; justify-content: space-between; width: 100%; padding: 10px; border-bottom: 2px solid #eee; font-size: 14px; background: rgba(255, 255, 255, 0.8); border-radius: 5px; padding: 10px; opacity: 0; animation: slideIn 1s ease-out forwards; } @keyframes slideIn { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .custom-products-wrapper { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 15px; justify-content: center; opacity: 0; animation: fadeIn 1.5s ease-in forwards; } .custom-product-item { background: rgba(255, 255, 255, 0.9); padding: 8px 12px; border-radius: 5px; font-size: 14px; display: inline-block; opacity: 0; animation: slideUp 1s ease-in forwards; } @keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .custom-product-link { color: #0071a1; font-weight: bold; text-decoration: none; transition: color 0.3s ease; } .custom-product-link:hover { color: #005a7d; } .custom-quantity { color: #555; font-size: 12px; } @media (max-width: 600px) { .custom-thankyou-box { padding: 15px; } .custom-order-info { flex-direction: column; align-items: flex-start; font-size: 12px; gap: 10px; } .custom-products-wrapper { flex-direction: column; gap: 15px; } .custom-product-item { font-size: 12px; padding: 6px 10px; } } @media (min-width: 601px) and (max-width: 1024px) { .custom-thankyou-box { padding: 18px; } .custom-order-info { font-size: 13px; gap: 15px; } .custom-products-wrapper { flex-direction: row; gap: 15px; } .custom-product-item { font-size: 13px; padding: 7px 12px; } } @media (min-width: 1025px) { .custom-thankyou-box { padding: 20px; } .custom-order-info { font-size: 14px; gap: 20px; } .custom-products-wrapper { gap: 20px; } .custom-product-item { font-size: 14px; padding: 8px 12px; } } span.customer-phone { font-weight: 400; color: #363636; } span.customer-name { font-weight: 400; color: #363636; } .custom-product-link { color: #040095; } span.quantity.custom-quantity { color: #282828; margin-right: 5px; font-weight: 400; } .user-profile-container { position: relative; display: inline-block; cursor: pointer; } .profile-header { display: flex; align-items: center; gap: 5px; background: white; padding: 5px; border-radius: 5px; } .profile-modal { display: none; position: absolute; z-index: 9999; justify-content: center; align-items: center; opacity: 0; transition: opacity 0.3s ease-out, transform 0.3s ease-out; width: 310px; border-radius: 8px; margin-top: 5px; left: 10px !important; top: 70px !important; transform: translateY(-50px); } .modal-content { background: white; border-radius: 8px; padding: 20px; width: 100%; opacity: 1; transform: scale(0.8); } .profile-avatar { width: 35px; height: 35px; border-radius: 100px!important; } .profile-toggle-icon { width: 16px; height: 16px; cursor: pointer; transition: transform 0.2s; } .modal-name { font-size: 18px; font-weight: bold; margin-bottom: 15px; margin-top: 0px !important; display: inline-block; position: relative; } .modal-close { font-size: 20px; color: #333; cursor: pointer; position: absolute; top: 0; right: -30px; padding: 5px; background: #f1f1f1; border-radius: 50%; width: 25px; height: 25px; display: flex; justify-content: center; align-items: center; } .modal-divider { height: 1px; background-color: #ccc; margin: 10px 0; } .profile-modal ul { list-style: none; padding: 0; margin: 0; } .profile-modal ul li { margin: 10px 0; } .profile-modal ul li a { text-decoration: none; color: #333; display: block; padding: 5px; font-size: 14px; } .blur-background { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(5px); z-index: 9998; } img.avatar.avatar-40.photo { border-radius: 100px; } .ucd-comments-container { font-family: "Zarin-font", sans-serif; } .ucd-login-message, .ucd-no-comments { font-weight: 400; } .ucd-meta-line { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; } .ucd-meta-box { background-color: #f3f4f6; border-radius: 6px; padding: 6px 12px; font-weight: 400; font-size: 14px; color: #333; display: inline-block; } .ucd-status-approved { background-color: #d4f5d4; color: #1c7c1c; } .ucd-status-pending { background-color: #ffe7ad; color: #a97000; } .ucd-meta-type { background-color: #d4e4ff; color: #004080; } .ucd-post-link { font-weight: 500; font-size: 14px; margin-bottom: 15px; color: #373c4a; } .ucd-link { color: #0073aa; text-decoration: none; font-weight: 600; } .ucd-link:hover { text-decoration: underline; } .ucd-comment-text { font-weight: 400; font-size: 15px; color: #444; } p.ucd-comment-text { line-height: 2em; } @font-face{font-family: 'Zarin-font';font-display:swap} .cupd-wrapper { position: relative; display: inline-block; font-family: 'Zarin-font'; user-select: none; z-index: 99999; } .cupd-profile { display: flex; align-items: center; gap: 8px; background: #0D59F1 !important; color: #fff; padding: 15px 10px !important; border-radius: 15px !important; cursor: pointer; transition: background-color 0.3s ease, box-shadow 0.25s ease; min-width: 100% !important; user-select: none; box-shadow: 0px 0px 0px #000 !important; border: 0px solid #e7e7e7; } .cupd-profile:hover, .cupd-profile:focus { background: #1E67F8 !important; box-shadow: 0px 0px 0px #000 !important; outline: none; } .cupd-avatar { border-radius: 8px!important; width: 35px !important; height: 35px !important; flex-shrink: 0; box-shadow: 0 0 5px rgba(0,0,0,0.2); transition: box-shadow 0.3s ease; } .cupd-profile:hover .cupd-avatar { box-shadow: 0 0 5px rgba(0,0,0,0.2); } .cupd-username { font-weight: 400; white-space: nowrap; font-size: 15px; text-shadow: 0 0px 0px rgba(0,0,0,0.3) !important; color: #fff; } .cupd-arrow-icon { font-size: 16px; color: #fff; transition: transform 0.2s ease; margin-left: auto; } .cupd-wrapper:hover .cupd-arrow-icon, .cupd-wrapper:focus-within .cupd-arrow-icon { transform: rotate(180deg); margin-top: -5px; } .cupd-dropdown-spacer { position: absolute; top: 100%; left: 0; width: 100%; height: 20px; pointer-events: auto; z-index: 99998; } .cupd-dropdown-menu { position: absolute; top: calc(100% + 20px); left: 0; background: #fff; box-shadow: 0 8px 50px rgba(0,0,0,0.15); border-radius: 15px !important; min-width: 280px; max-height: 0; overflow: hidden; display: flex; flex-direction: column; opacity: 0; pointer-events: none; transition: opacity 0.3s ease, max-height 0.4s ease, padding 0.3s ease; z-index: 99999; padding-bottom: 0px !important; padding-top: 15px !important; } .cupd-wrapper:hover .cupd-dropdown-menu, .cupd-wrapper:hover .cupd-dropdown-spacer, .cupd-wrapper:focus-within .cupd-dropdown-menu, .cupd-wrapper:focus-within .cupd-dropdown-spacer { max-height: 600px; padding: 12px 0; opacity: 1; pointer-events: auto; } .cupd-dropdown-menu ul { list-style: none; margin: 0; padding: 0; } .cupd-dropdown-menu li { padding: 15px; display: flex; align-items: center; gap: 8px; font-size: 14px; color: #334155; font-weight: 400; transition: background-color 0.25s ease; cursor: pointer; border-left: 4px solid transparent; user-select: none; } .cupd-dropdown-menu li:hover { background-color: #fff8ea; border-left-color: #ffb31e; color: #0d59f1; } .cupd-dropdown-menu li svg { width: 16px; height: 16px; flex-shrink: 0; stroke: currentColor; transition: color 0.3s ease; } .cupd-dropdown-menu li:hover svg { stroke: #0d59f1; } .cupd-dropdown-menu li svg path { transition: stroke 0.3s ease; } .cupd-dropdown-menu li:hover svg path { stroke: #0d59f1 !important; } .cupd-dropdown-menu li a { color: inherit; text-decoration: none; flex-grow: 1; user-select: none; } .cupd-dropdown-menu li a:hover { text-decoration: none; } .cupd-logout-btn { background: #f5f5f5; box-shadow: 0px 0px 0px #000; color: #5a6e85; margin-top: 15px; padding: 14px 0; text-align: center; font-size: 14px; font-weight: 500; border-radius: 0 0 15px 15px; cursor: pointer; text-decoration: none; user-select: none; transition: background-color 0.25s ease, box-shadow 0.25s ease; box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.3); } .cupd-logout-btn:hover { background: #ececec; box-shadow: inset 0 0 12px rgba(0,0,0,0.25); color: #2c3a4a; } .cupd-login-link { display: inline-block; padding: 10px 20px; background: linear-gradient(135deg, #1e90ff, #005f8d); color: #fff; border-radius: 8px; text-decoration: none; font-weight: 700; box-shadow: 0 2px 6px rgba(30, 144, 255, 0.5); transition: background-color 0.3s ease, box-shadow 0.3s ease; } .cupd-login-link:hover { background: linear-gradient(135deg, #0073aa, #004f6b); box-shadow: 0 4px 12px rgba(0,115,170,0.8); } .cupd-dropdown-menu li { padding: 15px; display: flex; align-items: center; gap: 8px; font-size: 14px; color: #334155; font-weight: 400; transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease; cursor: pointer; border-left: 4px solid transparent; user-select: none; } .cupd-dropdown-menu li:hover { background-color: #eaf0ff; border-left-color: #0d59f1; color: #0d59f1; } .cupd-dropdown-menu li svg { width: 16px; height: 16px; flex-shrink: 0; color: inherit; } .cupd-dropdown-menu li svg path[stroke], .cupd-dropdown-menu li svg circle[stroke], .cupd-dropdown-menu li svg rect[stroke], .cupd-dropdown-menu li svg line[stroke], .cupd-dropdown-menu li svg polyline[stroke], .cupd-dropdown-menu li svg polygon[stroke] { stroke: currentColor !important; transition: stroke 0.25s ease; } .cupd-dropdown-menu li svg path[fill], .cupd-dropdown-menu li svg circle[fill], .cupd-dropdown-menu li svg rect[fill], .cupd-dropdown-menu li svg line[fill], .cupd-dropdown-menu li svg polyline[fill], .cupd-dropdown-menu li svg polygon[fill] { fill: currentColor !important; transition: fill 0.25s ease; } .cupd-dropdown-menu li a { color: inherit; text-decoration: none; flex-grow: 1; user-select: none; } @media (max-width: 768px) { .cupd-profile { border-radius: 12px !important; min-width: auto !important; padding-right: 12px !important; padding-left: 12px !important; } } @media only screen and (max-width: 1024px) { nav#zrmm-container-1 { display: none; } } @media only screen and (max-width: 1024px) { span.cupd-username { display: none; } .cupd-profile { padding: 6px ! Important; gap: 2px; } .cupd-avatar { width: 33px !important; height: 33px !important; } } @media only screen and (max-width: 767px) { .cupd-profile { padding: 7px ! Important; } .cupd-avatar { width: 30px !important; height: 30px !important; } .cupd-arrow-icon { display: none; } } .zarindo-grid { font-family: 'Zarin-font'; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 0px 15px 15px 15px; overflow-x: auto; box-sizing: border-box; max-width: 100%; -webkit-overflow-scrolling: touch; } @media (max-width: 768px) { .zarindo-grid { grid-template-columns: 1fr !important; overflow-x: hidden !important; } } .zarindo-card { border: 1px solid #f4f4f4; border-radius: 12px; padding: 16px; background: #fff; text-align: center; box-sizing: border-box; } .zarindo-card img { width: auto; max-width: 45px; height: auto; max-height: 45px; object-fit: contain; border-radius: 8px; margin-bottom: 10px; } .zarindo-title a { font-size: 13px; font-weight: 500; color: #2d3a49; text-decoration: none; transition: 0.2s all; } .zarindo-meta { font-size: 12px; color: #2eb526; font-weight: 600; margin: 15px 0px; } img.wbdiac-security-icon { width: 16px !important; height: 16px !important; margin-bottom: 0 !important; } .zarindo-btn-download { display: inline-flex; align-items: center; justify-content: center; gap: 6px; background-color: #ffe475; color: #333; border: none; border-radius: 8px; padding: 10px 16px; font-size: 14px; cursor: pointer; transition: all 0.3s ease-in-out; margin-top: 10px; width: 100%; } .zarindo-btn-download:hover { background-color: #facc15; transform: translateY(-1px); box-shadow: 0 2px 6px rgba(0,0,0,0.08); } .zarindo-license-btn .wbdiac-show-licenses-btn { width: 100% !important; background: #edf3ff !important; font-size: 14px !important; border-radius: 11px !important; color: #6097F3 !important; margin-bottom: -10px; padding: 10px 0; } .zarindo-modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); z-index: 9999; display: flex; align-items: center; justify-content: center; } .zarindo-modal { background: #fff; border-radius: 22px; padding: 24px 24px 30px; max-width: 480px; width: 90%; box-shadow: 0 20px 40px rgba(0,0,0,0.2); position: relative; font-family: 'Zarin-font'; } .zarindo-modal h3 { font-size: 15px; margin-top: 30px; margin-bottom: 25px; text-align: center; color: #2d3a49; line-height: 1.8em; } .zarindo-file { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; font-size: 13px; background: #fff; border: 1px solid #00000017; padding: 8px 12px; border-radius: 8px; transition: 0.3s all; } .zarindo-file:hover { background: #F9FAFC; border-color: #F9FAFC; box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.10196078431372549); } .zarindo-close { position: absolute; top: 12px; left: 12px; width: 28px; height: 28px; padding: 0; cursor: pointer; border: none; background: transparent; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; } .zarindo-close svg path { stroke: #FF8A65; transition: stroke 0.3s ease; } .zarindo-close:hover svg path { stroke: #e06c4e; } .zarindo-loader { text-align: center; padding: 30px; } @keyframes spin { 0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);} } .zarindo-spinner { border: 4px solid #f3f3f3; border-top: 4px solid #ff8a65; border-radius: 50%; width: 36px; height: 36px; animation: spin 1s linear infinite; margin: 0 auto; } .zarindo-btn-download svg { width: 16px; height: 16px; } button.zarindo-btn-download { background: #ffbf29; color: #fff; font-weight: 600; padding: 15px 10px; border-radius: 11px; margin-top: 20px; } [type=button]:focus,[type=button]:hover,[type=submit]:focus,[type=submit]:hover,button:focus,button:hover { background-color: unset!Important; } .zarindo-file { color: #2d3a49; font-weight: 400; font-size: 14px; } button.zarindo-btn-download:hover { background: #ff9e08!important; } button.zarindo-btn-download:focus { background: #ff9e08!Important; } .zarindo-title a:hover { color: #6097F3!important; } img.wbdiac-close-icon { width: 35px!Important; } h2.wbdiac-modal-title { font-size: 15px !important; font-weight: 600 !important; color: #3d5370 !important; text-align: center; margin-bottom: 35px!important; margin-top: 15px!important; } .zarindo-license-btn .wbdiac-show-licenses-btn:hover { background: #d3e2ff !important; } .zarinprci-wrapper { display: inline-flex; font-family: 'Zarin-font'; font-size: 14px; gap: 0 !important; flex-direction: column !important; align-items: flex-end !important; } .zarinprci-wrapper span { display: inline-block; margin-bottom: 4px; } .zarinprci-regular { color: #333652; font-size: 13px; font-weight: 400; } .zarinprci-regular del { text-decoration: line-through; } .zarinprci-sale { color: #3bbf1c; font-weight: bold; font-size: 16px; } .zarinprci-normal { color: #333652; font-weight: 600; font-size: 16px; } .zarinprci-free { color: #3bbf1c; font-weight: 700; font-size: 16px; } .zarinprci-toman { width: 16px; height: auto; vertical-align: middle; margin-right: 4px; } .ztmb-menu{ font-family:'Zarin-font'; direction:rtl; z-index:1000; position:relative; } .ztmb-root { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 10px 0; font-size: 16px; font-weight: 500; color: #fff; } .ztmb-sub { list-style: none; margin: 0; padding: 0; background: transparent; display: none; flex-direction: column; gap: 5px; color: #f7f7f7; } .ztmb-item.ztmb-open > .ztmb-sub { display: flex; } .ztmb-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px 0; } .ztmb-link { color: #fff; text-decoration: none; padding: 8px 6px; font-size: 15px; display: inline-flex; align-items: center; flex: 1; } .ztmb-sub { list-style: none; margin: 0; padding: 0 15px 0 0; background: transparent; display: block; max-height: 0; overflow: hidden; flex-direction: column; gap: 5px; color: #f7f7f7; transition: max-height 0.3s ease-in-out; } .ztmb-item.ztmb-open > .ztmb-sub { max-height: 500px; } .ztmb-toggle { background: none; border: none; cursor: pointer; padding: 6px; display: flex; align-items: center; justify-content: center; margin-right: 6px; width: 40px; height: 40px; border-radius: 4px; } @media (max-width: 768px) { .ztmb-root { flex-direction: column; } .ztmb-sub { display: none; } .ztmb-item.ztmb-open > .ztmb-sub { display: flex; } } a.ztmb-link { color: #25303E!important; } .ztmb-root > .ztmb-item > .ztmb-row > .ztmb-link{ font-weight:600; font-size: 15px; } .ztmb-sub .ztmb-link{ font-weight:500; color:#455067; font-size: 14px; } .zrblogcopy-copy-button{ cursor:pointer; display:inline-block; transform:scale(1); transition:transform .3s; } .zrblogcopy-copy-button img{ width:24px; height:24px; } .zrblogcopy-notification{ position:fixed; top:-80px; right:20px; background:#2fc936; color:#fff; padding:10px; border-radius:11px; display:none; opacity:0; transition:opacity .5s,top .5s; font-size:15px; font-weight:500; z-index:9999; width:300px; align-items:center; flex-direction:row-reverse; } .zrblogcopy-notification.show{ display:flex; opacity:1; top:50px; } .zrblogcopy-notification .notification-text{ flex:1; margin-right:10px; } .zrblogcopy-notification img{ width:20px; height:20px; } .zrthlink-copy-button { cursor: pointer; display: inline-block; margin: 10px; transform: scale(1); transition: transform 0.3s ease; } .zrthlink-copy-button img { width: 24px; height: 24px; } .zrthlink-notification { position: fixed; top: -80px; right: 20px; background-color: #2fc936; color: white; padding: 10px; border-radius: 11px; display: none; opacity: 0; transition: opacity 0.5s, top 0.5s; font-size: 15px; font-weight: 500; z-index: 9999; width: 300px; display: flex; align-items: center; flex-direction: row-reverse; } .zrthlink-notification.show { display: flex; opacity: 1; top: 50px; } .zrthlink-notification .notification-text { flex: 1; margin-right: 10px; } .zrthlink-notification img { width: 20px; height: 20px; } .zarinpwt-repeater-wrap { margin-top:15px; } .zarinpwt-row { background:#f5f7ff; padding:0; border-radius:10px; border:1px solid #dfe3f1; margin-bottom:12px; overflow:hidden; cursor:move; } .zarinpwt-row-header { padding:12px 15px; background:#e2e7f8; font-weight:600; display:flex; justify-content:space-between; align-items:center; cursor:pointer; } .zarinpwt-row-header span { font-size:13px;color:#333; } .zarinpwt-toggle-btn { font-size:18px;font-weight:bold;cursor:pointer;color:#444; } .zarinpwt-row-body { padding:15px; display:none; } .zarinpwt-row input{ width:100%; padding:8px 10px; border-radius:6px; border:1px solid #c7c7d4; margin-bottom:10px; } .zarinpwt-add-row { background:#3172ff; color:#fff; padding:10px 18px; border-radius:8px; cursor:pointer; display:inline-block; margin-top:10px; } .zarinpwt-remove-row{ background:#e53935; color:#fff; padding:7px 13px; border-radius:6px; cursor:pointer; display:inline-block; margin-top:6px; } .zarinpwt-table{ width:100%; margin-top:25px; border-radius:12px; overflow:hidden; background:#f6f8ff; font-family: 'Zarin-Font'; } .zarinpwt-table ul { margin: 0; padding: 10px 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr 1fr 0.8fr; border-bottom: 1px solid #e3e6f5; text-align: center; align-items: center; } .zarinpwt-table-head{ background:#e8ecfb; font-size:13px; font-weight:600; color:#556180; } .zarinpwt-table-body ul{ font-size:14px; color:#4a4f62; } .zarinpwt-btn{ background:#4b6bff; padding:7px 16px; color:#fff; border-radius:8px; display:inline-flex; align-items:center; gap:7px; text-decoration:none; font-size:13px; transition:0.25s; font-weight: 500; border-radius: 50px; } .zarinpwt-btn svg path{ fill:#fff; } a.zarinpwt-btn { background: #e5e7eb !important; color: #09183F !important; } a.zarinpwt-btn:hover { background: #0D59F1 !important; color: #fff!important; } .zarinpwt-table-head { background: #e8ecfb; font-size: 14px; font-weight: 600; color: #25303e; } a.zarinpwt-btn svg{ width: 20px; height: 20px; flex-shrink: 0; } a.zarinpwt-btn svg path{ fill: currentColor; transition: fill .25s ease; } #changelog-wrapper input, #changelog-wrapper textarea{ width:100%; margin-bottom:8px; } .changelog-row{ border:1px solid #ddd; background:#fafafa; border-radius:6px; margin-bottom:10px; overflow:hidden; } .changelog-header{ background:#f1f1f1; padding:10px 12px; cursor:pointer; display:flex; justify-content:space-between; align-items:center; font-weight:600; } .changelog-header .toggle{ font-size:18px; font-weight:bold; } .changelog-body{ display:none; padding:12px; } .remove-row{ background:#e74c3c; color:#fff; border:none; padding:5px 10px; border-radius:4px; cursor:pointer; } #add-changelog-row{ background:#3498db; color:#fff; border:none; padding:10px 15px; border-radius:4px; cursor:pointer; } .changelog-list { display: flex; flex-direction: column; gap: 12px; font-family: 'Zarin-Font', sans-serif; } .changelog-item { background: #fafafa; border-radius: 10px; padding: 12px 15px; border: 1px solid #e0e0e0; transition: 0.2s; } .changelog-item:hover { background: #f3f3f3; } .changelog-item.latest { background: #e8ffe8; border-color: #2ecc71; } .changelog-top { display: flex; justify-content: space-between; margin-bottom: 6px; font-weight: bold; font-size: 14px; } .version, .date { background: #efefef; padding: 3px 10px; border-radius: 20px; font-size: 13px; font-weight: 500; } .changelog-item.latest .version, .changelog-item.latest .date { background: #d9ffd9; font-weight: bold; } .changelog-desc { color: #555; line-height: 1.6; font-size: 13px; padding-top: 3px; } .changelog-item.latest .version, .changelog-item.latest .date { background: #6cf39d; font-weight: bold; } @media (max-width: 480px) { .changelog-item { padding: 10px 12px; } .changelog-top { flex-direction: column; align-items: flex-start; gap: 4px; } .version, .date { font-size: 12px; padding: 3px 8px; } .changelog-desc { font-size: 12px; } } .zarin-prfaq-item { background: #f7f7f7; border-radius: 10px; padding: 0; margin-bottom: 10px; border: 1px solid #ddd; } .zarin-prfaq-header { padding: 10px 12px; font-weight: bold; cursor: pointer; background: #e9edf3; border-radius: 10px; } .zarin-prfaq-body { display: none; padding: 12px; } .zarin-prfaq-remove { background: #dc3545; color: #fff; padding: 5px 10px; border-radius: 6px; cursor: pointer; display: inline-block; margin-top: 10px; } #zarin-prfaq-add { background: #2271b1; color: #fff; padding: 8px 12px; border-radius: 6px; cursor: pointer; display: inline-block; margin-bottom: 10px; } .zarin-prfaq-item.dragging { opacity: 0.4; } .zarin-prfaq-q { background: #eff3f8; padding: 18px 15px; border-radius: 12px; margin-bottom: 15px; display: flex; align-items: center; gap: 10px; justify-content: space-between; cursor: pointer; } .zarin-prfaq-left { display: flex; align-items: center; gap: 10px; } .zarin-prfaq-q h3 { font-size: 15px; margin: 0; color: #19222e; } .zarin-prfaq-a { display: none; padding: 12px; background: #ffffff; border-radius: 10px; color: #455067; line-height: 1.7; margin-top: 0px; margin-bottom: 8px; border: 1px solid #00000017; } .zarin-prfaq-q svg.arrow { transition: 0.25s; } .zarin-prfaq-q.active svg.arrow { transform: rotate(180deg); fill: #0D59F1; } .zarin-btn { display: inline-flex; align-items: center; gap: 8px; background: #09183F; color: #fff; padding: 10px 18px; border-radius: 10px; font-weight: 700; font-size: 14px; transition: .25s; border: none; } .zarin-btn:hover { background: #0c2259; } .zarin-btn svg path, .zarin-btn svg rect { stroke: #fff !important; fill: #fff !important; } .zarin-btn-locked { background: #e5e7eb !important; color: #09183F !important; } .zarin-btn-locked svg path, .zarin-btn-locked svg rect { stroke: #09183F !important; fill: none !important; } .zarin-files-ui { display: flex; flex-direction: column; gap: 16px; margin-top: 20px; font-family: 'Zarin-Font' !important; } .zarin-file-card { position: relative; display: flex; gap: 15px; background: #fff; border: 1px solid #e1e5eb; border-radius: 14px; padding: 14px; box-shadow: 0 4px 15px rgba(0,0,0,.05); align-items: center; overflow: hidden; } .zarin-card-locked::after { content: "برای دانلود وارد شوید یا محصول را خریداری کنید"; position: absolute; inset: 0; background: rgba(255,255,255,.85); backdrop-filter: blur(4px); display: flex; justify-content: center; align-items: center; font-weight: 800; font-size: 14px; } .zarin-thumb img { width: 60px; height: 60px; object-fit: cover; border-radius: 10px; } .zarin-info { flex: 1; } .zarin-name { font-size: 15px; font-weight: 700; } .zarin-progress-box { width: 100%; height: 6px; background: #d1d5db; border-radius: 6px; overflow: hidden; margin-top: 8px; display: none; } .zarin-progress { width: 0%; height: 100%; background: linear-gradient(90deg, #10b981, #34d399); transition: width .12s linear; } .zarin-file-wrap { background: #f1f5f9; border: 1px solid #dce1e7; border-radius: 10px; margin-bottom: 10px; overflow: hidden; } .zarin-file-header { padding: 10px 12px; background: #e2e8f0; cursor: pointer; font-weight: 700; display: flex; align-items: center; justify-content: space-between; } .zarin-file-body { padding: 12px; display: none; animation: fadeIn .3s ease; } @keyframes fadeIn { from {opacity: 0;} to {opacity: 1;} } .zarin-file-body input { width: 100%; margin: 6px 0 10px 0; } .zarin-remove-btn { background: #d63031; color: white; padding: 6px 10px; border-radius: 6px; cursor: pointer; display: inline-block; margin-top: 5px; } #zarin-add-file-btn { background: #2563eb; color: #fff; padding: 10px 14px; border-radius: 8px; cursor: pointer; margin-top: 10px; display: inline-block; font-weight: 700; } .zr-gallery-wrap { max-width: 100%; margin: 0 auto; text-align: center; } .zr-main-img img { width: 100%; object-fit: contain; border-radius: 16px!important; border: 8px solid #fff!important; box-shadow: rgba(119,132,157,.15) 0 5px 50px!important; transition: .2s ease; cursor: zoom-in; } .zr-fade-out { opacity: 0; transition: opacity .15s ease; } .zr-thumbs { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 20px; } .zr-thumb { width: 85px; height: 85px; cursor: pointer; border-radius: 8px; overflow: hidden; transition: .2s; } .zr-thumb img { width: 100%; height: 100%; object-fit: cover; } .zr-thumb:hover { transform: scale(1.05); } @media (max-width: 600px) { .zr-thumb { width: 70px; height: 70px; } } .zr-lightbox-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.8); display: flex; justify-content: center; align-items: center; z-index: 99999; animation: zr-fade-in .2s ease; } .zr-lightbox-img { max-width: 90%; max-height: 90%; border-radius: 16px; border: 8px solid #fff; box-shadow: rgba(119,132,157,.15) 0 5px 50px; } .zr-lightbox-hide { animation: zr-fade-out .2s ease forwards; } .zr-gallery-wrap { max-width: 100%; margin: 0 auto; text-align: center; } .zr-main-img { width: 100%; margin-bottom: 20px; padding: 0!important; border: none!important; box-shadow: none!important; background: none!important; border-radius: 0!important; overflow: visible!important; } .zr-main-img img { width: 100%; object-fit: contain; border-radius: 16px!important; border: 8px solid #fff!important; box-shadow: rgba(119,132,157,.15) 0 5px 50px!important; transition: .2s ease; cursor: zoom-in; } .zr-thumbs { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 20px; } @media (max-width: 600px) { .zr-thumbs { flex-wrap: nowrap !important; overflow-x: auto !important; overflow-y: hidden; padding-bottom: 10px; justify-content: flex-start !important; -webkit-overflow-scrolling: touch; scrollbar-width: none; } .zr-thumbs::-webkit-scrollbar { display: none; } .zr-thumb { width: 70px; height: 70px; flex: 0 0 auto; } } @keyframes zr-fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes zr-fade-out { from { opacity: 1; } to { opacity: 0; } } #product-preview-box{ width:100%; min-height:350px; display:none; align-items:center; justify-content:center; flex-direction:column; position:relative; overflow:hidden; } .preview-loader{ display:flex; align-items:center; justify-content:center; gap:8px; } .dot{ width:10px; height:10px; background:#ffb900; border-radius:50%; animation:bounce 0.6s infinite alternate; } .dot:nth-child(2){ animation-delay:0.2s; } .dot:nth-child(3){ animation-delay:0.4s; } @keyframes bounce{ 0%{ transform:translateY(0); opacity:1; } 100%{ transform:translateY(-9px); opacity:0.4; } } .preview-text{ color:#444; font-weight:600; font-size:15px; margin-top:12px; text-align:center; } .preview-error p{ font-weight:600; color:#333; } .preview-buttons{ margin-top:20px; display:flex; gap:12px; justify-content:center; } .preview-buttons button{ padding:10px 18px; border:none; border-radius:10px; cursor:pointer; font-weight:600; display:flex; align-items:center; gap:6px; font-size:14px; transition:0.2s; box-shadow:0 3px 10px rgba(0,0,0,0.1); } .preview-open{ background:#27ae60; color:#fff; } .preview-open svg{ width:16px; height:16px; stroke:#fff; } .preview-report{ background:#e74c3c; color:#fff; } .preview-report svg{ width:16px; height:16px; stroke:#fff; } #product-preview-box iframe{ width:100%; min-height:70vh; border:0; } @media(max-width:768px){ #product-preview-box iframe{ min-height:75vh; border-radius:10px; } } #product-preview-box{ width:100%; min-height:90vh; display:none; align-items:center; justify-content:center; flex-direction:column; position:relative; overflow:hidden; } .preview-loader{ display:flex; flex-direction:column; align-items:center; justify-content:center; } .loader-dots{ display:flex; gap:8px; } .dot{ width:10px; height:10px; background:#ffb900; border-radius:50%; animation:bounce .6s infinite alternate; } .dot:nth-child(2){animation-delay:.2s} .dot:nth-child(3){animation-delay:.4s} @keyframes bounce{ 0%{transform:translateY(0)} 100%{transform:translateY(-10px)} } .preview-text{ margin-top:14px; font-weight:600; font-size:15px; color:#222; background:#ffffff; padding:6px 14px; border-radius:8px; box-shadow:0 3px 10px rgba(0,0,0,.08); } #product-preview-box iframe{ width:100%; height:93vh; border:0; } @media(max-width:768px){ #product-preview-box iframe{ height:100vh; } } .preview-loader { margin-top: 20px; } .preview-error p { font-weight: 600; color: #25303E; font-size: 18px; text-align: center; } button.preview-open { background: #20c37a; padding: 15px 15px; border-radius: 12px; } button.preview-report { box-shadow: 0 0 0 #000; background: #ff000017; color: #d52929; border-radius: 12px; } .preview-report svg { width: 16px; height: 16px; stroke: #d52929; } .zarinres-wrapper{ width:100%; display:flex; justify-content:center; margin-bottom:20px; } .zarinres-toolbar{ display:flex; gap:12px; justify-content:center; align-items:center; flex-wrap:wrap; } .zarinres-btn{ position:relative; border:none; cursor:pointer; padding:12px; border-radius:12px; background:#ECEFF3; display:flex; align-items:center; justify-content:center; transition:background .25s; } .zarinres-btn:hover{ transform:none !important; } .zarinres-btn.active{ background:#FFB900; } .zarinres-icon{ width:24px; height:24px; stroke:#54667A; transition:.25s; } .zarinres-btn.active .zarinres-icon{ stroke:#25303E; } .zarinres-tip{ position:absolute; bottom:-40px; background:#25303E; color:#fff; font-size:13px; font-weight:400; border-radius:8px; padding:6px 12px; opacity:0; transform:translateY(6px); transition:.25s ease; pointer-events:none; white-space:nowrap; } .zarinres-btn:hover .zarinres-tip{ opacity:1; transform:translateY(0); } #product-preview-box iframe{ transition:all .55s cubic-bezier(.25,.8,.25,1); margin:0 auto; display:block; } @media(max-width:600px){ .zarinres-toolbar{ gap:8px; } .zarinres-btn{ padding:10px; } .zarinres-icon{ width:20px; height:20px; } } .zarinres-btn:hover { background: #d9dfe6!important; } .zarinth-tag-container { display: flex; flex-wrap: wrap; gap: 8px; overflow: hidden; } .zarinth-tag-item { background: #eff3f8; color: #64748B; padding: 7px 12px; border-radius: 8px; font-size: 13px; text-decoration: none; transition: 0.25s; display: inline-block; } .zarinth-tag-item:hover { background: #0D59F1; color: #FFFFFF; }