/* === Scrollbar Styling === */
.detailed-config-panel::-webkit-scrollbar { width: 0; height: 0; display: none; }
.detailed-config-panel::-webkit-scrollbar-track { background: transparent; }
.detailed-config-panel::-webkit-scrollbar-thumb { background: transparent; }

.select-dropdown { scrollbar-width: none; -ms-overflow-style: none; }
.select-dropdown::-webkit-scrollbar { width: 0; height: 0; display: none; }
.select-dropdown::-webkit-scrollbar-track { background: transparent; }
.select-dropdown::-webkit-scrollbar-thumb { background: transparent; }

/* === Color Popover Animation === */
.tag-color-popover { }

/* === Color Grid === */
.color-grid-tight { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }

/* === Color Dot === */
.color-dot { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--border-color); }
.color-dot:hover { border-color: var(--accent-color); }

/* === Date Select Wrapper Enhancement === */
.date-select-wrapper { transition: opacity var(--transition-base) ease, filter var(--transition-base) ease; }
.date-select-wrapper:hover { filter: brightness(1.02); }
.date-select-wrapper.disabled { opacity: 0.35; pointer-events: none; filter: grayscale(0.5); }

/* === Education Card Enhancement === */
.education-edit-card { transition: all var(--transition-base) ease; }
.education-edit-card:hover { border-color: #c7c7d0; }

/* === Contact Edit Row Enhancement === */
.contact-edit-row { transition: all var(--transition-base) ease; }

/* === Form Row Enhancement === */
.form-row.date-row { transition: all var(--transition-base) ease; }
.form-row.date-row:hover { border-color: var(--border-hover); }

/* === Metrics Grid Enhancement === */
.metrics-grid-editor { transition: all var(--transition-base) ease; }

/* === Avatar Upload Enhancement === */
.avatar-upload-circle { transition: all var(--transition-base) ease, transform var(--transition-base) ease; }
.avatar-upload-circle:hover { transform: scale(1.05); }

/* === Unified Add Buttons Enhancement === */
.unified-add-buttons .editor-add-btn.simple { transition: all var(--transition-base) ease; }
.unified-add-buttons .editor-add-btn.simple:hover { transform: translateY(-1px); }

/* === Row Delete Button Enhancement === */
.row-delete-btn { transition: all var(--transition-base) ease; }
.row-delete-btn:hover { transform: scale(1.1); }

/* === Editor Add Button Enhancement === */
.editor-add-btn { transition: all var(--transition-base) ease; }
.editor-add-btn:hover { transform: translateY(-2px); }

/* === Library Category Item Enhancement === */
.library-cat-item { transition: all var(--transition-base) ease; }
.library-cat-item:hover { transform: translateX(4px); }

/* === Module Card Enhancement === */
.module-card { transition: all var(--transition-base) ease; }
.module-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }

/* === Timeline Delete Enhancement === */
.timeline-delete { transition: all var(--transition-base) ease; }
.timeline-delete:hover { transform: scale(1.1) rotate(10deg); }

/* === Project Card Enhancement === */
.project-card { transition: all var(--transition-base) ease; }
.project-card:hover { box-shadow: var(--shadow-md); border-color: var(--accent-color); }

/* === Exp Tag Enhancement === */
.exp-tag { transition: all var(--transition-base) ease; }
.exp-tag:hover { border-color: #c7c7d0; }
.exp-role {  }
.proj-name {  }
.proj-name span { font-family: inherit; }

/* === Skill Modern Item Enhancement === */
.skill-modern-item { transition: all var(--transition-base) ease; }

/* === Skill Battery Bar Animation === */
.skill-battery-bar { transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1); }

/* === Button Module Action Enhancement === */
.btn-module-action { transition: all var(--transition-base) ease; }

/* === Resume Header Card Enhancement === */
.resume-header-card { transition: all var(--transition-base) ease; }
.resume-header-card:hover { box-shadow: var(--shadow-md); }

/* === Resume Avatar Enhancement === */
.resume-avatar { transition: all var(--transition-base) ease; }
.resume-avatar:hover { box-shadow: 0 8px 20px rgba(0,0,0,0.12); }

/* === Sidebar Item Enhancement === */
.sidebar-item { transition: all var(--transition-base) ease; }

/* === Timeline Item Enhancement === */
.timeline-item { transition: all var(--transition-base) ease; }

/* === Timeline Dot Enhancement === */
.timeline-dot { transition: all var(--transition-base) ease; }