/* ===================================================================
   Capora Image Tools — style.css (فاز ۱)
   روی توکن‌ها و هدر/فوتر /articles/style.css سوار است (حالت تیره هم از همان).
   =================================================================== */
.it-wrap{max-width:860px;margin:0 auto;padding:0 20px;}
.it-hero{padding:44px 0 22px;text-align:center;}
.it-hero h1{font-size:clamp(25px,4.6vw,38px);font-weight:900;line-height:1.5;letter-spacing:-.02em;margin-bottom:12px;}
.it-hero h1 span{color:var(--primary);}
.it-hero p{color:var(--secondary);font-size:14.5px;max-width:600px;margin:0 auto;line-height:1.9;}
.it-trust{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:18px;}
.it-trust span{font-size:11.5px;font-weight:700;padding:6px 12px;border-radius:20px;background:var(--surface);border:1px solid var(--border);color:var(--secondary);}

/* کارت اصلی ابزار */
.it-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:28px;}
.it-tabs{display:flex;background:var(--card);border-bottom:1px solid var(--border);}
.it-tab{flex:1;border:none;background:transparent;font-family:inherit;font-size:13.5px;font-weight:800;color:var(--secondary);padding:15px 8px;cursor:pointer;border-bottom:3px solid transparent;transition:.15s;}
.it-tab:hover{color:var(--text);}
.it-tab.on{color:var(--primary);background:var(--surface);border-bottom-color:var(--primary);}
.it-tab:focus-visible,.it-btn:focus-visible,.it-run:focus-visible,.it-pick:focus-visible{outline:3px solid rgba(99,102,241,.45);outline-offset:-3px;}

.it-panel{padding:18px;}
.it-panel[hidden]{display:none;}
.it-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.it-grid .full{grid-column:1/-1;}
@media (max-width:520px){.it-grid{grid-template-columns:1fr;}}
.it-field label,.it-lbl{display:block;font-size:11.5px;font-weight:800;color:var(--secondary);margin-bottom:5px;}
.it-field input[type=text],.it-field select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font-size:13.5px;font-weight:600;background:var(--bg);color:var(--text);font-family:inherit;}
.it-field input[type=text]{direction:ltr;text-align:left;}
.it-field input:focus,.it-field select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(99,102,241,.15);}
.it-field input[type=range]{width:100%;accent-color:var(--primary);}
.it-range-row{display:flex;align-items:center;gap:10px;}
.it-range-row output{min-width:44px;text-align:center;font-weight:800;font-size:13px;color:var(--primary);}
.it-field[hidden],.it-grid [hidden]{display:none;}
.it-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.it-hint{font-size:11.5px;color:var(--secondary);line-height:1.8;margin-top:6px;}
.it-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.it-chip{font-family:inherit;font-size:11.5px;font-weight:700;padding:6px 11px;border-radius:20px;border:1px solid var(--border);background:var(--bg);color:var(--secondary);cursor:pointer;}
.it-chip:hover{border-color:var(--primary);color:var(--primary);}
.it-radios{display:flex;gap:8px;}
.it-radios label{flex:1;margin:0;cursor:pointer;}
.it-radios input{position:absolute;opacity:0;pointer-events:none;}
.it-radios span{display:block;text-align:center;padding:11px 6px;border:1px solid var(--border);border-radius:10px;font-size:13px;font-weight:800;color:var(--secondary);background:var(--bg);}
.it-radios input:checked+span{border-color:var(--primary);color:var(--primary);background:rgba(99,102,241,.1);}
.it-radios input:focus-visible+span{outline:3px solid rgba(99,102,241,.45);}
.it-field input[type=color]{width:100%;height:42px;border:1px solid var(--border);border-radius:10px;background:var(--bg);padding:3px;cursor:pointer;}

/* ناحیه رها کردن فایل */
.it-drop{margin:18px 18px 12px;border:2px dashed var(--border);border-radius:16px;padding:26px 16px;text-align:center;background:var(--bg);transition:.15s;}
.it-drop.over{border-color:var(--primary);background:rgba(99,102,241,.08);}
.it-drop .ic{font-size:30px;margin-bottom:6px;}
.it-drop p{font-size:13px;color:var(--secondary);margin:4px 0 12px;}
.it-pick{display:inline-block;background:var(--primary);color:#fff;border:none;border-radius:12px;padding:12px 26px;font-family:inherit;font-weight:800;font-size:14px;cursor:pointer;box-shadow:0 8px 18px rgba(99,102,241,.3);}
.it-pick:hover{background:var(--primary-dark);}
.it-drop small{display:block;margin-top:12px;font-size:11px;color:var(--secondary);}

/* لیست و عملیات */
.it-work{padding:0 18px 18px;}
.it-work[hidden]{display:none;}
.it-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;}
.it-run{flex:2;min-width:180px;background:var(--primary);color:#fff;border:none;border-radius:12px;padding:13px;font-family:inherit;font-weight:900;font-size:14px;cursor:pointer;}
.it-run:disabled{opacity:.55;cursor:not-allowed;}
.it-run:not(:disabled):hover{background:var(--primary-dark);}
.it-sec{flex:1;min-width:110px;background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:13px 10px;font-family:inherit;font-weight:800;font-size:12.5px;cursor:pointer;}
.it-sec:hover:not(:disabled){border-color:var(--primary);color:var(--primary);}
.it-sec[hidden]{display:none;}
.it-sec:disabled{opacity:.5;cursor:not-allowed;}
.it-status{font-size:12.5px;font-weight:700;color:var(--secondary);min-height:20px;margin-bottom:6px;}
.it-status.ok{color:var(--green);} .it-status.warn{color:var(--amber);}
.it-summary{font-size:12px;font-weight:800;color:var(--text);margin-bottom:10px;}
.it-list{display:flex;flex-direction:column;gap:10px;}
.it-item{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:10px;}
.it-item.err{border-color:var(--red);}
.it-thumb{width:56px;height:56px;border-radius:10px;overflow:hidden;background:var(--bg);flex-shrink:0;border:1px solid var(--border);}
.it-thumb img{width:100%;height:100%;object-fit:cover;}
.it-info{flex:1;min-width:0;}
.it-name{font-size:12.5px;font-weight:800;direction:ltr;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.it-meta{font-size:11.5px;color:var(--secondary);margin-top:2px;}
.it-out{font-size:12px;font-weight:700;margin-top:3px;}
.it-save{color:var(--green);margin-inline-start:4px;} .it-save.up{color:var(--amber);}
.it-note{font-size:11px;color:var(--secondary);margin-top:3px;line-height:1.7;} .it-note.bad{color:var(--red);font-weight:700;}
.it-actions{display:flex;gap:6px;flex-shrink:0;}
.it-btn{font-family:inherit;font-size:12px;font-weight:800;border-radius:9px;padding:8px 12px;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;text-decoration:none;}
.it-btn.dl{background:var(--green);border-color:var(--green);color:#fff;}
.it-btn.rm{padding:8px 10px;color:var(--secondary);}
.it-btn.rm:hover{background:var(--red);border-color:var(--red);color:#fff;}
@media (max-width:480px){.it-item{flex-wrap:wrap;}.it-actions{width:100%;justify-content:flex-end;}}

/* محتوای سئو زیر ابزار */
.it-prose{max-width:720px;margin:0 auto;padding:0 20px;}
.it-toc-note{font-size:12px;color:var(--secondary);margin-bottom:6px;}
.it-tools-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 8px;}
@media (max-width:620px){.it-tools-row{grid-template-columns:1fr;}}
.it-tool{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;}
.it-tool b{display:block;font-size:14px;margin-bottom:4px;}
.it-tool p{font-size:12.5px;color:var(--secondary);line-height:1.8;margin:0;}
.it-tool .ic{font-size:22px;display:block;margin-bottom:6px;}
.prose table td,.prose table th{white-space:nowrap;}
.tbl-scroll{overflow-x:auto;border-radius:12px;}
.num{direction:ltr;unicode-bidi:isolate;display:inline-block;}
.it-prose ol{list-style-type:persian;}

/* ===================== فاز ۲: هاب میانبر ===================== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.hub{max-width:860px;margin:0 auto 26px;}
.hub-head h2{font-size:19px;font-weight:900;margin-bottom:4px;}
.hub-head p{font-size:12.5px;color:var(--secondary);line-height:1.9;margin-bottom:12px;}
.hub-tools{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.hub-search{flex:1;display:block;}
.hub-search input{width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font-family:inherit;font-size:13px;font-weight:600;}
.hub-search input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(99,102,241,.15);}
.hub-count{font-size:11.5px;font-weight:800;color:var(--secondary);white-space:nowrap;}
.hub-cats{display:flex;gap:7px;overflow-x:auto;padding:2px 2px 8px;margin-bottom:6px;scrollbar-width:thin;-webkit-overflow-scrolling:touch;}
.hub-cat{flex:0 0 auto;font-family:inherit;font-size:12px;font-weight:800;padding:8px 13px;border-radius:20px;border:1px solid var(--border);background:var(--surface);color:var(--secondary);cursor:pointer;transition:.15s;white-space:nowrap;}
.hub-cat:hover{border-color:var(--primary);color:var(--primary);}
.hub-cat.on{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 6px 14px rgba(99,102,241,.3);}
.hub-cat:focus-visible,.sc-card:focus-visible,.sc-chip:focus-visible{outline:3px solid rgba(99,102,241,.5);outline-offset:2px;}
.hub-recent{background:var(--card);border:1px dashed var(--border);border-radius:14px;padding:10px 12px;margin-bottom:12px;}
.hub-recent[hidden],.sc-card[hidden],.hub-empty[hidden],.sc-banner[hidden]{display:none;}
.hub-recent-t{display:block;font-size:11px;font-weight:800;color:var(--secondary);margin-bottom:7px;}
.hub-recent-row{display:flex;flex-wrap:wrap;gap:7px;}

.sc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:10px;}
@media (max-width:420px){.sc-grid{grid-template-columns:1fr 1fr;gap:8px;}}
.sc-card{--c:#6366f1;position:relative;display:flex;flex-direction:column;gap:3px;text-decoration:none;color:var(--text);
  background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:13px 12px 12px;overflow:hidden;
  box-shadow:var(--shadow);transition:transform .15s,border-color .15s,box-shadow .15s;}
.sc-card::before{content:'';position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--c);opacity:.9;}
.sc-card::after{content:'';position:absolute;width:80px;height:80px;border-radius:50%;background:var(--c);opacity:.07;top:-34px;inset-inline-end:-24px;}
.sc-card:hover{transform:translateY(-3px);border-color:var(--c);box-shadow:0 14px 28px rgba(30,41,59,.12);}
.sc-card:active{transform:translateY(0) scale(.98);}
.sc-card.on{border-color:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 28%,transparent),0 14px 28px rgba(30,41,59,.12);}
.sc-ic{font-size:22px;line-height:1.2;}
.sc-t{font-size:13.5px;font-weight:900;line-height:1.5;}
.sc-spec{font-size:11.5px;font-weight:800;color:var(--c);direction:ltr;unicode-bidi:isolate;display:inline-block;}
.sc-tip{font-size:11px;color:var(--secondary);line-height:1.7;}
.hub-empty{text-align:center;color:var(--secondary);font-size:13px;padding:22px 0;}

.sc-chip{--c:var(--primary);font-family:inherit;font-size:12px;font-weight:800;padding:8px 12px;border-radius:20px;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;transition:.15s;}
.sc-chip:hover{border-color:var(--c);color:var(--c);}
.sc-chip.on{background:var(--c);border-color:var(--c);color:#fff;box-shadow:0 6px 14px color-mix(in srgb,var(--c) 35%,transparent);}
.sc-chip.on .sc-spec{color:#fff;}
.sc-variants{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin-top:18px;}
.sc-variants-t{font-size:11.5px;font-weight:800;color:var(--secondary);width:100%;}
.hub-back{text-align:center;font-size:12px;margin:0 0 14px;}
.hub-back a{color:var(--primary);font-weight:700;text-decoration:none;}

/* بنر «میانبر فعال» بالای کارت ابزار */
.sc-banner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 14px;background:linear-gradient(120deg,rgba(99,102,241,.14),rgba(236,72,153,.12));border-bottom:1px solid var(--border);font-size:12.5px;font-weight:800;}
.sc-banner-t{flex:1;min-width:180px;}
.sc-banner .sc-spec{margin-inline-start:4px;}
.sc-auto{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--secondary);cursor:pointer;}
.sc-auto input{accent-color:var(--primary);width:16px;height:16px;}
.sc-x{border:none;background:var(--surface);color:var(--secondary);width:28px;height:28px;border-radius:50%;cursor:pointer;font-family:inherit;font-size:12px;border:1px solid var(--border);}
.sc-x:hover{background:var(--red);color:#fff;border-color:var(--red);}

/* پالس ناحیه‌ی رها کردن بعد از انتخاب میانبر */
@keyframes scPulse{0%{box-shadow:0 0 0 0 rgba(99,102,241,.55);}100%{box-shadow:0 0 0 18px rgba(99,102,241,0);}}
.it-drop.pulse{animation:scPulse 1s ease-out 2;border-color:var(--primary);}
@media (prefers-reduced-motion: reduce){.sc-card,.sc-chip{transition:none;}.it-drop.pulse{animation:none;}}

/* اصلاح سرریز افقی هاب در موبایل: آیتم‌های فلکس باید بتوانند کوچک شوند */
.it-wrap{min-width:0;}
.hub,.hub-tools,.hub-search,.hub-cats{min-width:0;max-width:100%;}
.hub-search input{min-width:0;width:100%;box-sizing:border-box;}
.hub-cats{width:100%;}
.sc-grid>*{min-width:0;}
.sc-tip,.sc-t{overflow-wrap:anywhere;}
.hub-count{flex:0 0 auto;}
.sc-card .sc-spec{display:block;white-space:normal;overflow-wrap:anywhere;}