/* ══════════════════════════════════════════════════════════════════════════
   sync-tool.css  —  Sync Tool page specific styles
   .card/.btn override shared.css. Defines --fail/--success locals.
   ══════════════════════════════════════════════════════════════════════════ */

/* Page-specific */
.card{background:var(--card-bg);border:1px solid var(--glass-border);border-radius:24px;padding:1.75rem 2rem;margin-bottom:1.1rem;box-shadow:0 8px 32px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.1),inset 0 -1px 0 rgba(0,0,0,0.1);backdrop-filter:blur(40px) saturate(150%);-webkit-backdrop-filter:blur(40px) saturate(150%);position:relative;overflow:hidden;}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);}
.card::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--glass-shine);pointer-events:none;border-radius:24px;}
.section-title{font-size:0.72rem;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--text);margin:0 0 1.1rem;position:relative;z-index:1;}
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.1rem;position:relative;z-index:1;}
.section-header .section-title{margin-bottom:0;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0.85rem;position:relative;z-index:1;}
@media(max-width:620px){.grid2{grid-template-columns:1fr}}
.field-group{display:flex;flex-direction:column;}
.field-group label{display:block;font-size:0.78rem;color:var(--text-dim);margin-bottom:0.4rem;font-weight:600;}
input[type="text"],input[type="password"]{width:100%;padding:0.75rem 1rem;background:var(--input-bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:0.875rem;box-sizing:border-box;transition:all 0.2s;outline:none;font-family:inherit;}
input:hover{border-color:rgba(88,101,242,0.5);}
input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(88,101,242,0.2);}
input::placeholder{color:#555;}
input:disabled{opacity:0.35;cursor:not-allowed;}
.divider{border:none;border-top:1px solid rgba(88,101,242,0.12);margin:0.85rem 0;position:relative;z-index:1;}
.tag-toggle{display:flex;align-items:center;gap:0.5rem;font-size:0.8rem;color:var(--text-dim);cursor:pointer;padding:0.1rem 0;user-select:none;}
.tag-toggle input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;flex-shrink:0;}
.tag-toggle code{background:rgba(124,92,252,0.12);border:1px solid rgba(124,92,252,0.25);border-radius:4px;padding:0.05rem 0.35rem;font-size:0.72rem;color:var(--accent2);}
.tag-toggle:hover{color:var(--text);}
.btn-row{display:flex;gap:0.65rem;flex-wrap:wrap;margin-top:1.1rem;align-items:center;position:relative;z-index:1;}
/* sync-tool uses animated lift + shimmer on all buttons — page-specific enhancement */
button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.45rem;padding:0.75rem 1.3rem;border-radius:9px;border:1px solid;font-size:0.875rem;font-weight:700;cursor:pointer;transition:all 0.2s;white-space:nowrap;position:relative;overflow:hidden;font-family:inherit;}
button::after,.btn::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.07),transparent);transform:translateX(-100%);transition:transform 0.45s;}
button:hover:not(:disabled)::after,.btn:hover:not(:disabled)::after{transform:translateX(100%);}
.btn-accent:hover:not(:disabled){background:rgba(88,101,242,0.25);border-color:rgba(88,101,242,0.6);box-shadow:0 5px 18px rgba(88,101,242,0.3);transform:translateY(-2px);}
.btn-green:hover:not(:disabled){background:rgba(46,204,113,0.25);border-color:rgba(46,204,113,0.6);box-shadow:0 5px 18px rgba(46,204,113,0.3);transform:translateY(-2px);}
.btn-cyan:hover:not(:disabled){background:rgba(0,188,212,0.25);border-color:rgba(0,188,212,0.6);box-shadow:0 5px 18px rgba(0,188,212,0.3);transform:translateY(-2px);}
.btn-sm{padding:0.45rem 0.9rem;font-size:0.8rem;}
button:disabled,.btn:disabled{opacity:0.35;cursor:not-allowed;transform:none !important;box-shadow:none !important;}
/* cs-btn styles provided by shared.css */
.conn-row{display:flex;flex-wrap:wrap;gap:0.65rem;margin-top:0.85rem;position:relative;z-index:1;}
.pill{display:inline-flex;align-items:center;gap:0.4rem;padding:0.3rem 0.75rem;border-radius:20px;font-size:0.78rem;font-weight:600;border:1px solid;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;}
.pill-idle{background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.1);color:var(--text-dim);}
.pill-ok{background:rgba(46,204,113,0.12);border-color:rgba(46,204,113,0.35);color:#a5d6a7;}
.pill-err{background:rgba(231,76,60,0.12);border-color:rgba(231,76,60,0.35);color:#ef9a9a;}
.dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.pill-idle .dot{background:var(--text-dim);}
.pill-ok .dot{background:var(--success);box-shadow:0 0 5px var(--success);}
.pill-err .dot{background:var(--fail);box-shadow:0 0 5px var(--fail);}
.sync-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.9rem;position:relative;z-index:1;}
.sync-badge{display:inline-flex;align-items:center;gap:0.4rem;padding:0.25rem 0.7rem;border-radius:20px;font-size:0.75rem;font-weight:700;}
.badge-idle{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);color:var(--text-dim);}
.badge-running{background:rgba(255,193,7,0.12);border:1px solid rgba(255,193,7,0.35);color:#ffe082;}
.badge-pulse{animation:pulse 1.1s ease infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.3}}
.sync-meta{font-size:0.78rem;color:var(--text-dim);margin-top:0.75rem;line-height:1.7;position:relative;z-index:1;}
.sync-meta strong{color:var(--text);}
.log-terminal{border-radius:12px;overflow:hidden;border:1px solid var(--glass-border);box-shadow:0 4px 16px rgba(0,0,0,0.3);background:rgba(10,10,20,0.6);position:relative;z-index:1;}
.log-terminal-header{background:rgba(26,26,37,0.9);padding:10px 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);}
.terminal-title{font-size:0.7rem;color:#888;text-transform:uppercase;letter-spacing:2px;font-weight:700;}
#log-box{margin:0;padding:1rem;background:rgba(13,13,18,0.9);white-space:pre-wrap;font-family:'Fira Code','Consolas',monospace;font-size:0.78rem;line-height:1.7;color:#d1d1e0;height:300px;overflow-y:auto;}
.log-line{margin:0;white-space:pre-wrap;word-break:break-all;display:block;}
.log-info{color:#9daeff;}.log-warning{color:#ffe082;}.log-error{color:#ef9a9a;}.log-debug{color:#45455a;}.log-empty{color:var(--text-dim);font-style:italic;}
#log-box::-webkit-scrollbar{width:6px;}#log-box::-webkit-scrollbar-track{background:#0d0d12;}#log-box::-webkit-scrollbar-thumb{background:#333;border-radius:3px;}#log-box::-webkit-scrollbar-thumb:hover{background:var(--accent);}
.spin{display:inline-block;animation:spin 0.75s linear infinite;}
@keyframes spin{to{transform:rotate(360deg)}}
#toast{position:fixed;bottom:1.4rem;right:1.4rem;z-index:999;padding:0.7rem 1.1rem;border-radius:10px;font-size:0.83rem;font-weight:600;opacity:0;transform:translateY(8px);transition:opacity 0.25s,transform 0.25s;pointer-events:none;max-width:320px;}
#toast.show{opacity:1;transform:translateY(0);}
#toast.ok{background:rgba(46,204,113,0.92);border:1px solid rgba(46,204,113,0.6);color:var(--text);}
#toast.err{background:rgba(231,76,60,0.92);border:1px solid rgba(231,76,60,0.6);color:var(--text);}
#toast.info{background:rgba(88,101,242,0.92);border:1px solid rgba(88,101,242,0.6);color:var(--text);}
.last-result-card{position:relative;z-index:1;}
.result-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;position:relative;z-index:1;}
.result-tile{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:.75rem 1rem;}
.result-tile .rt-label{font-size:.62rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-dim);margin-bottom:.3rem;}
.result-tile .rt-val{font-size:1.4rem;font-weight:800;font-family:'DM Mono',monospace;color:var(--text);line-height:1;}
.result-tile.added .rt-val{color:var(--green);}
.result-tile.skipped .rt-val{color:var(--amber);}
.result-tile.failed .rt-val{color:var(--red);}
.result-meta{font-size:.72rem;color:var(--text-dim);margin-top:.65rem;position:relative;z-index:1;}
.vc-toggle-wrap{display:inline-flex;align-items:center;gap:.65rem;cursor:pointer;user-select:none;}
.vc-toggle-wrap input[type=checkbox]{position:absolute;opacity:0;width:0;height:0;pointer-events:none;}
.vc-toggle-track{width:32px;height:18px;border-radius:9px;flex-shrink:0;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);position:relative;transition:all .2s;}
.vc-toggle-thumb{width:12px;height:12px;border-radius:50%;background:var(--text-dim);position:absolute;top:2px;left:2px;transition:all .2s;}
.vc-toggle-wrap input:checked ~ .vc-toggle-track{background:var(--accent);border-color:var(--accent);box-shadow:0 0 8px rgba(124,92,252,.35);}
.vc-toggle-wrap input:checked ~ .vc-toggle-track .vc-toggle-thumb{left:16px;background:#fff;}
.schedule-row{display:flex;align-items:center;gap:.65rem;margin-top:.75rem;position:relative;z-index:1;flex-wrap:wrap;}
.schedule-row label{font-size:.78rem;color:var(--text-dim);white-space:nowrap;}
.schedule-input{width:80px;padding:.4rem .65rem;background:rgba(0,0,0,.38);border:1px solid var(--border);border-radius:var(--radius-xs);color:var(--text);font-family:inherit;font-size:.84rem;outline:none;text-align:center;transition:border-color .18s;}
.schedule-input:focus{border-color:var(--accent-border);}
.sync-notice{display:none;padding:0.85rem 1.1rem 0.85rem 1rem;margin-bottom:1rem;border-radius:14px;border:1px solid rgba(88,101,242,0.35);background:rgba(88,101,242,0.07);gap:0.75rem;align-items:flex-start;}
.sync-notice.show{display:flex;}
/* vcSelect */
.vc-select-wrap{position:relative;width:100%;}
.vc-select-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0.6rem 0.85rem;background:rgba(0,0,0,0.38);border:1px solid rgba(124,92,252,0.28);border-radius:9px;color:var(--text);font-family:'DM Sans',inherit;font-size:0.84rem;cursor:pointer;transition:border-color 0.18s,box-shadow 0.18s,background 0.18s;user-select:none;gap:0.5rem;min-height:38px;}
.vc-select-trigger:hover:not(.is-disabled){border-color:rgba(124,92,252,0.5);background:rgba(0,0,0,0.42);}
.vc-select-trigger.is-open{border-color:rgba(124,92,252,0.65);box-shadow:0 0 0 3px rgba(124,92,252,0.12);background:rgba(0,0,0,0.42);border-radius:9px 9px 6px 6px;}
.vc-select-trigger.is-disabled{opacity:0.38;cursor:not-allowed;}
.vc-select-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);}
.vc-select-text.is-placeholder{color:var(--text-muted,#4a4a68);}
.vc-select-chevron{flex-shrink:0;transition:transform 0.2s cubic-bezier(0.34,1.56,0.64,1);}
.vc-select-trigger.is-open .vc-select-chevron{transform:rotate(180deg);}
.vc-select-panel{position:fixed;z-index:99999;background:linear-gradient(145deg,#141424,#0e0e1c);border:1px solid rgba(124,92,252,0.45);border-radius:0 0 11px 11px;box-shadow:0 16px 48px rgba(0,0,0,0.7),0 0 0 1px rgba(124,92,252,0.08);overflow:hidden;animation:vcDropIn 0.17s cubic-bezier(0.16,1,0.3,1) both;min-width:120px;}
.vc-select-panel.vc-flip{border-radius:11px 11px 0 0;border-top:1px solid rgba(124,92,252,0.45);border-bottom:1px solid rgba(124,92,252,0.2);}
@keyframes vcDropIn{from{opacity:0;transform:scaleY(0.9) translateY(-6px)}to{opacity:1;transform:scaleY(1) translateY(0)}}
@keyframes vcDropUp{from{opacity:0;transform:scaleY(0.9) translateY(6px)}to{opacity:1;transform:scaleY(1) translateY(0)}}
.vc-select-panel.vc-flip{animation-name:vcDropUp;}
.vc-select-list{max-height:220px;overflow-y:auto;overscroll-behavior:contain;padding:0.3rem 0;}
.vc-select-list::-webkit-scrollbar{width:4px;}.vc-select-list::-webkit-scrollbar-track{background:transparent;}.vc-select-list::-webkit-scrollbar-thumb{background:rgba(124,92,252,0.25);border-radius:2px;}
.vc-option{display:flex;align-items:center;gap:0.55rem;padding:0.52rem 0.9rem;font-size:0.83rem;font-family:'DM Sans',inherit;color:var(--text-dim,#9898b8);cursor:pointer;transition:background 0.1s,color 0.1s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;}
.vc-option:hover{background:rgba(124,92,252,0.1);color:var(--text,#eeeef8);}
.vc-option.is-selected{color:var(--accent2,#a78bfa);background:rgba(124,92,252,0.08);}
.vc-option.is-selected::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--accent,#7c5cfc);border-radius:0 2px 2px 0;}
.vc-option-tick{margin-left:auto;flex-shrink:0;opacity:0;}
.vc-option.is-selected .vc-option-tick{opacity:1;}
.vc-option.is-placeholder{color:var(--text-muted,#4a4a68);font-style:italic;font-size:0.8rem;}
.vc-option.is-placeholder:hover{background:rgba(255,255,255,0.02);color:var(--text-muted,#4a4a68);}
.vc-select-hidden{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;overflow:hidden;top:0;left:0;}
@media(max-width:500px){body{padding:1rem 0.5rem 2rem}.card{padding:1.25rem;border-radius:16px}#log-box{height:220px;font-size:0.73rem}}
@media(max-width:500px){.result-tiles{grid-template-columns:1fr 1fr}}
