@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font/dist/font-face.css');
:root { --p: #2563eb; --bg: #ffffff; --err: #e11d48; }
#ids-app { font-family: 'Vazir', sans-serif; max-width: 750px; margin: 30px auto; background: var(--bg); padding: 25px; border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.08); direction: rtl; }
.ids-header { text-align: center; margin-bottom: 20px; }
.ids-notice-box { background: #fef9c3; color: #854d0e; padding: 15px; border-radius: 10px; border: 1px solid #fde047; text-align: center; margin-bottom: 20px; font-weight: bold; }
.ids-search-box { display: flex; gap: 10px; background: #f1f5f9; padding: 8px; border-radius: 12px; }
.ids-search-box input { flex: 1; border: none; background: transparent; outline: none; padding: 10px; font-size: 16px; }
#ids-check-btn { background: var(--p); color: #fff; border: none; padding: 0 20px; border-radius: 8px; cursor: pointer; }
.ids-spin { width: 16px; height: 16px; border: 3px solid #ccc; border-top-color: var(--p); border-radius: 50%; display: inline-block; animation: sp 1s infinite linear; margin-left: 8px; vertical-align: middle; }
@keyframes sp { to { transform: rotate(360deg); } }
#ids-loader { text-align: center; padding: 15px; color: var(--p); }
.ids-card { display: flex; gap: 20px; margin-top: 20px; background: #fff; padding: 20px; border-radius: 15px; border: 1px solid #eee; }
.ids-img { flex: 1; text-align: center; }
.ids-img img { max-width: 100%; max-height: 250px; border-radius: 10px; }
.ids-data { flex: 1.5; }
.ids-details-table { background: #f8fafc; padding: 15px; border-radius: 10px; margin-top: 15px; }
.ids-old-price { text-decoration: line-through; color: #94a3b8; margin-left: 8px; font-size: 0.9em; display: inline-block; }
.ids-dr { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: 0.9em; }
.ids-total-row { font-weight: bold; color: var(--p); font-size: 1.1em; border-top: 1px solid #e2e8f0; padding-top: 10px; margin-top: 10px; }
.ids-ship-note { background: #e2e8f0; font-size: 0.8em; padding: 5px; border-radius: 5px; text-align: center; margin-top: 5px; }
.ids-manual-wrap { border: 2px dashed #f59e0b; padding: 20px; border-radius: 15px; background: #fffbeb; }
.ids-flex-row { display: flex; gap: 10px; margin-bottom: 10px; }
.ids-flex-row input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 8px; }
#ids-m-calc { width: 100%; background: #f59e0b; color: #fff; padding: 10px; border: none; border-radius: 8px; cursor: pointer; font-weight: bold; }
#ids-form-area { margin-top: 30px; border-top: 2px solid #f1f5f9; padding-top: 20px; }
.ids-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 15px; }
#ids-form input, #ids-form textarea { width: 100%; padding: 12px; border: 1px solid #cbd5e1; border-radius: 8px; box-sizing: border-box; font-family: inherit; }
#ids-form textarea { height: 80px; resize: vertical; }
.ids-submit { width: 100%; background: #10b981; color: #fff; padding: 15px; font-size: 1.1em; font-weight: bold; border: none; border-radius: 10px; cursor: pointer; }
.ids-checkbox-wrap { display: flex !important; align-items: center !important; margin: 15px 0 !important; }
.ids-checkbox-wrap label { display: flex !important; align-items: center !important; gap: 10px !important; width: auto !important; cursor: pointer; }
.ids-checkbox-wrap input[type="checkbox"] { appearance: checkbox !important; -webkit-appearance: checkbox !important; width: 20px !important; min-width: 20px !important; height: 20px !important; margin: 0 !important; display: inline-block !important; position: static !important; }
.ids-checkbox-wrap span { font-size: 0.95em; }
@media(max-width: 600px) { .ids-card { flex-direction: column; } .ids-grid { grid-template-columns: 1fr; } .ids-dr { flex-direction: column; align-items: flex-start; gap: 5px; } }