/* Arrow Icon Block Styles */
.custom-arrow-icon-block {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: var(--arrow-padding-vertical, 0) var(--arrow-padding-horizontal, 0);
}

.custom-arrow-icon-block .arrow-icon-wrapper {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.custom-arrow-icon-block .arrow-svg {
  width: var(--arrow-size, 2rem);
  height: var(--arrow-size, 2rem);
  transition: transform 0.3s ease;
  display: block;
}

/* レスポンシブ回転 */
/* PC (1024px以上) */
@media (min-width: 1024px) {
  .custom-arrow-icon-block .arrow-svg {
    transform: rotate(var(--pc-rotate, 0deg));
  }
}

/* タブレット (768px - 1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
  .custom-arrow-icon-block .arrow-svg {
    transform: rotate(var(--tablet-rotate, 0deg));
  }
}

/* スマートフォン (767px以下) */
@media (max-width: 767px) {
  .custom-arrow-icon-block .arrow-svg {
    transform: rotate(var(--sp-rotate, 0deg));
  }
}

/* ホバーエフェクト */
.custom-arrow-icon-block:hover .arrow-svg {
  transform-origin: center;
}

@media (min-width: 1024px) {
  .custom-arrow-icon-block:hover .arrow-svg {
    transform: rotate(var(--pc-rotate, 0deg)) scale(1.05);
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .custom-arrow-icon-block:hover .arrow-svg {
    transform: rotate(var(--tablet-rotate, 0deg)) scale(1.05);
  }
}

@media (max-width: 767px) {
  .custom-arrow-icon-block:hover .arrow-svg {
    transform: rotate(var(--sp-rotate, 0deg)) scale(1.05);
  }
}

/* アライメント対応 */
.custom-arrow-icon-block.alignleft {
  justify-content: flex-start;
}

.custom-arrow-icon-block.alignright {
  justify-content: flex-end;
}

.custom-arrow-icon-block.aligncenter {
  justify-content: center;
}

/* アクセシビリティ */
.custom-arrow-icon-block {
  outline: none;
}

.custom-arrow-icon-block:focus-within {
  outline: 2px solid #007cba;
  outline-offset: 2px;
}

/* プリント用スタイル */
@media print {
  .custom-arrow-icon-block .arrow-svg {
    /* プリント時は回転を無効化 */
    transform: none !important;
  }
}
