/* torsion.css - 비틀림 전용 스타일 */

/* Torsion 전용 독립 불판(Wrapper) */
.torsion-drawing-wrapper {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    z-index: 9500;
}

/* Torsion 샤프트 호버 효과 (오렌지) */
.torsion-shaft-group .shaft-side-hover:hover {
    fill: #ff9500 !important;
    filter: brightness(1.2) drop-shadow(0 0 8px #ff9500);
    cursor: pointer;
}

/* Torsion 리스트 아이템 디자인 */
.torsion-expert-list-item {
    background: rgba(255, 149, 0, 0.1); /* 오렌지빛 배경 */
    border: 1px solid rgba(255, 149, 0, 0.3);
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 8px;
    color: #fff;
}

/* 비틀림 전용 노드 (주황색) */
.torsion-node-group .node-body {
    fill: #ff9500;
    stroke: white;
    stroke-width: 2;
}

/* 애니메이션 렉 방지 */
.torsion-svg-layer * {
    transition: none !important;
}


/* torsion.css - Axial 스타일 100% 이식 */

/* 1. 패널 카드 스타일 */
.shape-card {
    background-color: #3a3a3c;
    border-radius: 10px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: transform 0.2s, border-color 0.2s;
}
.shape-card:hover {
    transform: translateY(-2px);
    border-color: #007aff;
}
.shape-card.ready {
    border: 1px solid #34c759 !important;
    background: rgba(52, 199, 89, 0.1) !important;
    box-shadow: 0 0 10px rgba(52, 199, 89, 0.2);
}

/* 2. 미니 아이콘 */
.mini-shape-preview {
    width: 36px; height: 36px;
    display: flex; justify-content: center; align-items: center;
    background: #555; color: #fff; font-size: 10px; font-weight: bold;
    margin-right: 10px;
}
.mini-shape-preview.circle { border-radius: 50%; }
.mini-shape-preview.rect { border-radius: 2px; }

/* 3. 버튼 스타일 (Axial 복제) */
.quick-e-btn, .torsion-quick-g-btn {
    border-radius: 4px; font-size: 11px; padding: 2px 6px; cursor: pointer;
    transition: all 0.2s;
}
.quick-e-btn:hover, .torsion-quick-g-btn:hover {
    filter: brightness(1.2);
}

.shape-btn, .torsion-shape-btn {
    background-color: #eef0f2;
    color: #007aff;
    border: none;
    border-radius: 6px;
    padding: 4px 12px;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    width: 100%;
    text-align: center;
    transition: background 0.2s;
}
.shape-btn:hover, .torsion-shape-btn:hover {
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 122, 255, 0.5);
}

/* 4. 수정 버튼 (연필) */
.shape-edit-btn, .torsion-shape-edit-btn {
    background: transparent; border: none; cursor: pointer; padding: 4px;
    border-radius: 4px; display: flex; align-items: center; justify-content: center;
}
.shape-edit-btn:hover, .torsion-shape-edit-btn:hover {
    background-color: rgba(255, 255, 255, 0.2);
}
.shape-edit-btn img, .torsion-shape-edit-btn img {
    width: 16px; filter: invert(1); opacity: 0.8;
}

/* 5. 모달 (팝업) 스타일 공유 */
.solid-modal-overlay {
    z-index: 99999 !important;
}
.solid-modal-content {
    background: #1c1c1e; padding: 30px; border-radius: 16px;
    border: 1px solid #3a3a3c; box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.solid-mode-icon-btn {
    width: 44px; height: 44px; border-radius: 12px; background: #2c2c2e;
    border: 1px solid rgba(255,255,255,0.2); cursor: pointer;
    display: flex; align-items: center; justify-content: center;
}
.solid-mode-icon-btn.active {
    border-color: #007aff; box-shadow: 0 0 10px rgba(0,122,255,0.3);
}

/* 입력창 스타일 */
.apple-input {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    color: white;
    font-size: 14px;
    outline: none;
}
.apple-input:focus {
    border-color: #007aff;
    box-shadow: 0 0 0 4px rgba(10, 132, 255, 0.2);
}



/* [torsion.css] 🚨 [명륜이 수정] Torsion 좌표점 전용 형광 반짝임 */
@keyframes torsionFluorescentBlink {
    0%, 100% { filter: drop-shadow(0 0 2px #fff) brightness(1); }
    50% { filter: drop-shadow(0 0 15px #ff9500) brightness(2.2); } /* 육즙 터지는 광채! */
}

.node-blink-torsion {
    animation: torsionFluorescentBlink 1s infinite ease-in-out !important;
}



/* expert_mechanics_solid_torsion.js 상단 스타일 영역에 추가 */
.torsion-quick-input-btn {
    background: #2c2c2e; /* 애플 다크모드 버튼색 */
    border: 1px solid #48484a;
    border-radius: 8px;
    color: #0a84ff; /* 애플 시스템 블루 */
    font-size: 12px;
    font-weight: 600;
    padding: 8px 4px;
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
}

.torsion-quick-input-btn:hover {
    background: #3a3a3c;
    border-color: #0a84ff;
}

.shape-card.ready .torsion-quick-input-btn {
    border-color: rgba(52, 199, 89, 0.3);
}